实现背景的渐变可以通过为背景添加颜色渐变的图片，也可以使用浏览器的功能来为背景添加渐变的颜色

 在IE6或IE7浏览器下可以使用一下示例的CSS语句，设置filter属性来实现颜色

 filter:progid:DXImageTransform.Microsoft.gradient(enabled=true,gradientType=0,startColorStr=#f0f0f0,endColorStr=#020202);

 enabled:滤镜开关选项，其值可以是true或者false，分别用来打开和关闭滤镜；

 gradientType：渐变类型，其值为1时表示水平渐变，其值为0时表示垂直渐变；

 startColorStr:上端或左侧的起始颜色；

 endColorStr:下端或右侧的结束颜色

 background-image:-moz-linear-gradient(起始点||角度，{颜色，位置}，{颜色，位置}...........)；《火狐浏览器》

 background-image:-webkit-linear-gradient(起始点||角度，{颜色，位置}，{颜色，位置}...........)；《谷歌浏览器》

 background-image:-moz-linear-gradient(起始点||角度，{颜色，位置}，{颜色，位置}...........)；

HTML-CSS线性渐变的更多相关文章

  1. CSS线性渐变

    /*CSS线性渐变*/ FILTER: progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff, ...

  2. css线性渐变兼容

    css线性渐变兼容 background: linear-gradient(top, rgba(54, 77, 127, 0.8), rgba(54, 77, 127, 0.8)); backgrou ...

  3. css线性渐变--linear-gradient

    使用css直接写渐变,对于现在而言,应该属于比价简单的一件事了,在一定程度上,扁平化的设计趋势的出现,减少了使用渐变色的场景,但是并不影响我们逐渐的熟悉线性渐变Linear-gradient的写法. ...

  4. 深入理解CSS线性渐变linear-gradient

    × 目录 [1]定义 [2]渐变线 [3]色标 [4]重复渐变 [5]多背景 [6]应用场景 [7]IE兼容 前面的话 在CSS3出现之前,渐变效果只能通过图形软件设计图片来实现,可拓展性差,还影响性 ...

  5. 兼容IE与firefox、chrome的css 线性渐变（linear-gradient）

    现行渐变首先看下示例(1)垂直渐变 (2)垂直渐变 IE系列 filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF ...

  6. 兼容IE与firefox的css 线性渐变（linear-gradient）

    IE系列 filter: progid:DXImageTransform.Microsoft.Gradient(startColorStr='#FF0000',endColorStr='#F9F900 ...

  7. 纯css使用线性渐变实现滚动进度条(来自于微信前端早读课）

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. css之为文本添加线性渐变和外描边

    css之为文本添加线性渐变和外描边  一.效果: 描边:描边+渐变: 二.描边: api:text-stroke 问题:text-stroke的描边是居中描边,无法直接设置外描边 解决:在before ...

  9. CSS高效开发实战:CSS 3、LESS、SASS、Bootstrap、Foundation --读书笔记（3）线性渐变

    线性渐变可以设置3个参数值:方向.起始颜色.结束颜色.最简单的模式只需要定义起始颜色和结束颜色,起点.终点和方向默认自元素的顶部到底部.下面举例说明: .test{ background:linear ...

  10. 线性渐变css

    从上到下的线性渐变: #grad { background: -webkit-linear-gradient(red, blue); /* Safari 5.1 - 6.0 */ background ...

随机推荐

  1. qs.parse()、qs.stringify()使用方法

    qs是一个npm仓库所管理的包,可通过npm install qs命令进行安装. 1. qs.parse()将URL解析成对象的形式 const Qs = require('qs'); let url ...

  2. [math] 绘制空间几何体的直观图

    这么多年,一直凭着从天而降的神来之灵感画着立体图. 而今才知道在二维平面上绘制空间几何体的直观图也是有方法的.叫做“画法几何” 1. 斜二测图 就是倾斜y轴,使y轴与x轴成45度的夹角.见: http ...

  3. CABasicAnimation 划线动画

    CGFloat animateDuration = ; UIBezierPath *bezierPath = [[UIBezierPath alloc] init]; CGPoint centerFr ...

  4. Linux中常用命令

    .cd命令 cd    回到跟目录 cd uqihong     进入到uqihong这个文件夹(且cd命令只能一级一级的进入) 2.复制命令      cp -r /usr/local/tomcat ...

  5. Java如何写Common直接调用

    一:新建Class类,命名为:Common 1.  写public static 公共的静态方法:  2.  直接用  Common.方法名 就可以直接调用. 例如:写一个获取当前星期的方法. /** ...

  6. 去除字符串中的html代码

    public static String Html2Text(String inputString) { String htmlStr = inputString; // 含html标签的字符串 St ...

  7. Python3学习之路~6.3 类变量 VS 实例变量

    类变量 VS 实例变量 #Author:Zheng Na # 实例里面可以查询.增加.删除.修改实例变量 class Role: # 类名 # 类变量 name = '我是类name' n=1 n_l ...

  8. 根据数据库结构生成RzCheckTree

    现在大多数的方法是采用递归,但这种操作会频繁的去select数据库,降低了执行效率,稍微改动一些,效果会好不少,这里介绍一种方法,即一次性select出所有数据,然后按照ParentID排序,逐条添加 ...

  9. 调用run与调用start的区别

    调用start的结果 package TestException; public class test1 { public static void main(String[] args) { // 3 ...

  10. (转)Java静态内部类的实例化问题

    最近遇到的一个问题,记录一下. 静态内部类可以被实例化! 1.首先在外部类中的static方法中不能使用普通内部类,因为内部类必须要与外部类建立关联才能使用,可以说是同生共死. 2.我在编码过程中,需 ...