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. imadjust函数分析一

    声明:本文涉及到的行数皆指本文提供的附件imadjust.m的代码中行数 本文只讨论imadjust函数是一种用法,即 J = IMADJUST(I,[LOW_IN; HIGH_IN],[LOW_OU ...

  2. （原）Ubuntu14中安装GraphicsMagick

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/5661439.html 参考网址: http://comments.gmane.org/gmane.co ...

  3. PHP ReflectionClass

    <?php /** * @desc test reflectionclass * @author songweiqing * @create_time 2015-01-7 * */ class ...

  4. linux软件安装(rpm,源码编译)

    1.rpm(redhat package manager)管理器主要目的在于解决软件的安装.卸载.升级.查询.验证等,例如升级过程中,保留软件的配置文件,安装过程中,检查软件依赖的库文件,以及卸载过程 ...

  5. py2exe 生成带图标的单个文件实例

    随便拉了个学习时用的测试程序来做的实例,原程序如下: #Filename:for.py count=0 for i in range(1,100,2): count+=i else: print 't ...

  6. js阻止元素的默认事件与冒泡事件

    嵌套的div元素,如果父级和子元素都绑定了一些事件,那么在点击最内层子元素时可能会触发父级元素的事件,从而带来一定的影响. 1. event.preventDefault();  -- 阻止元素的默认 ...

  7. 前端MVVM学习之KnockOut(一)

    MVVM理解 MVVM即Model-View-viewModel,是微软WPF和MVP(Model-View-Presenter)结合发展演变过来的一种新型架构框架. MVVM设计模式有以下优点: ( ...

  8. C# 获取当前应用程序的绝对路径支持asp.net

      Asp.net在类库中获取某文件的绝对路径.这个问题在初学的时候就经常碰到过,经常是查了忘,忘了查.浪费了大量的今天专门写个文章,以后到这里查.有时间顺便记得研究下这个东西. 在主程序目录就不说了 ...

  9. git与svn的使用比较

    先说下基础知识: git是本地会(维护)有个版本仓库. svn本地也会维护一个自己的信息(一般是目录结构和文件状态的信息),这里的文件状态一般是指:文件是已删除,还是已添加,还是被修改等等.一般是会有 ...

  10. 完全跨站点跨域名单点(SSO)同步登录和注销

    先来说说什么是单点登录(SSO).来自百科的介绍:SSO英文全称Single Sign On,单点登录.SSO是在多个应用系统中,用户只需要登录一次就可以访问所有相互信任的应用系统.它包括可以将这次主 ...