CSS3/CSS1 background-image 属性

语法:

background-image：<bg-image> [ , <bg-image> ]*

<bg-image> = none | <url> | <linear-gradient> | <radial-gradient> | <repeating-linear-gradient> | <repeating-radial-gradient>

默认值：none

取值：

none：无背景图。

< url >：使用绝对或相对地址指定背景图像。

< linear-gradient>：使用线性渐变创建背景图像。（CSS3）

< radial-gradient>：使用径向(放射性)渐变创建背景图像。（CSS3）

< repeating-linear-gradient>：使用重复的线性渐变创建背景图像。（CSS3）

< repeating-radial-gradient>：使用重复的径向(放射性)渐变创建背景图像。（CSS3）

说明：

设置或检索对象的背景图像。

如果设置了background-image，同时也建议作者设置background-color用于当背景图像不可见时保持与文本一定的对比。

对应的脚本特性为backgroundImage。

demo 今天群里大神，用css3 做的这个撕边效果，大家 感受下~

<!DOCTYPE html>

<html>

<head>

  <meta charset="utf-8">

  <title>   </title>

  <style type="text/css">

  .w{ height: 300px;

     background:#f10180;

       background-image: repeating-radial-gradient(#fff,#fff 8px,#f10180 9px,#f10180 20px);

       background-size:20px 20px;background-repeat:repeat-x;

       background-position:0 -12px;

    }

  </style>

</head>

<body>

<div class="w"></div>

</body>

</html>

效果截图

css3实现一个div设置多张背景图片及background-image属性的更多相关文章

  1. css一个div设置多个背景图片

    html:定义一个div <div class="item__content"></div> css:样式 .item__content { positio ...

  2. CSS3设置多张背景图片

    background-image:url("1.jpg"),url("2.jpg"),url("3.jpg");background-rep ...

  3. 一个div添加多个背景图片

    效果图如下:

  4. 给div设置background-color: rgba(0, 0, 0, 0.2)属性，并加了css3动画--opacity动画淡出动画，之后div子元素的字体会抖一下

    问题:给div设置background-color: rgba(0, 0, 0, 0.2)属性,并加了css3动画--opacity动画淡出动画,之后div子元素的字体会抖一下: 解决:animati ...

  5. 关于设置UITableView的背景图片

    在UITableViewController中,要设置UITableView的背景图片,以前常用的方法是使用backgroundcolor属性,这个属性可以通过UIImage来获取,但最近发现这个方法 ...

  6. WPF 后台C#设置控件背景图片

    原文:WPF 后台C#设置控件背景图片 以前的程序中有做过,当时只是记得uri很长一大段就没怎么记.今天有人问了也就写下来.   这是一个Button,设置了Background后的效果. 前台的设置 ...

  7. IntelliJ IDEA设置主题和背景图片(背景色)

    设置主题以及背景图片 设置代码背景颜色

  8. CSS3利用一个div实现内圆角边框效果

    *首先要清楚的是,box-shadow的形状会随着border-radius变化.下面的例子可以证明: <!doctype html> <html lang="en&quo ...

  9. css2如何设置全屏背景图片

    每次在做一个网站后台登陆页面的时候,当UI给我一张背景是不规律的背景图片,但是在设置为背景时,总会遇到屏幕大小的问题,导致背景图片有可能平铺.这样UI的效果达不到也会很难看. 本来我想用body{ba ...

随机推荐

  1. C++之类和对象——C++ primer plus学习（一）

    一.类的构造函数和析构函数 1.构造函数:    1)试图将类成员名称用作构造函数的参数名是错误的.    2)构造函数的参数表示的不是类成员, 而是赋给类成员的值.    3)为了避免这种混乱,一种 ...

  2. gerrit升级到16.04之后连接不到服务器

    升级到ubuntu-16.04后,发现Git-review代码报错: Unable to negotiate with 10.140.110.77 port 29418: no matching ke ...

  3. 感觉tbceditor很不错，如果作者能坚持下来，非常非常看好啊

    感觉tbceditor很不错,如果作者能坚持下来,非常非常看好啊 你技术好,可以做个自用的IDE慢慢加功能 ,很方便的用这个控件,写个支持Delphi和html混编的编辑器,要不到2个小时

  4. Asp.net MVC Web.config配置技巧

    一.视图引入命名空间的设置 之前经常写这样的代码,而且每个页面都要写: @model IEnumerable<MvcStart.Models.People_Model> 其实有一种很方便的 ...

  5. hdu4393 Throw nails(只用模拟前面500来次，后面根据速度、位置、id值排序即可)

                                                                                                         ...

  6. 剑指offer-面试题23.从上往下打印二叉树

    题目:从上往下打印出二叉树的每个结点,同一层的结点按照从左到右的顺序打印.例如输入图4.5中 的二叉树,则依次打印出8.6.10.5.7.9.11二叉树结点的定义如下: struct BinaryTr ...

  7. SDP简要解析

    1.概述SDP也是MMUSIC工作组的一个产品,在MBONE内容中用得很多.其目的就是在媒体会话中,传递媒体流信息,允许会话描述的接收者去参与会话.SDP基本上在internet上工作.他定义了会话画 ...

  8. IOS 调用系统发邮件Api

    // 判断设备是否有发送邮件功能 NSString *deviceType = [UIDevice currentDevice].model; if([deviceType isEqualToStri ...

  9. CTSC1999补丁VS错误题解

    题目描写叙述 Description 错误就是人们所说的Bug.用户在使用软件时总是希望其错误越少越好.最好是没有错误的.可是推出一个没有错误的软件差点儿不可能,所以非常多软件公司都在疯狂地发放补丁( ...

  10. 虚拟机下opensips 启动

    先启动MYSQL mysql:service mysqld start 然后启动RTP代理 rtpproxy -l 192.168.6.199 -s udp:192.168.6.199:7890 -F ...