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

 在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. RabbitMQ 内存控制 硬盘控制

    RabbitMQ服务器在启动时以及abbitmqctl set_vm_memory_high_watermark fraction 执行时,会检查计算机的RAM总大小. 默认情况下下, 当 Rabbi ...

  2. Java与面向对象之随感(1)

    大一下学期上完了c++课程,当时自我感觉很良好,认为对面向对象编程已经是身经百战了,但是上了院里HuangYu老师的Java课之后,才发现自己对于面向对象的编程风格的理解只在皮毛,着实惭愧不已. 假设 ...

  3. [daily][centos][nginx] 在centos7使用nginx启用对文件目录的http访问

    1. 安装nginx yum install nginx 2. 修改配置 2.1 提供目录权限: 我需要访问的目录是 /home/data, 用户是data, 所以修改如下配置: [root@S205 ...

  4. da5_模块

    一.模块.包 什么是模块? 模块实质上就是一个python文件,它是用来组织代码的,意思就是说把python代码写到里面,文件名就是模块的名称,test.py test就是模块名称. 什么是包? 包, ...

  5. websocketd

    https://www.cnblogs.com/tinywan/p/6826125.html https://www.jianshu.com/p/63afd0099565

  6. 深入了解HBASE架构（转）

    dd by zhj: 最近的工作需要跟HBase打交道,所以花时间把<HBase权威指南>粗略看了一遍,感觉不过瘾,又从网上找了几篇经典文章. 下面这篇就是很经典的文章,对HBase的架构 ...

  7. 去除html

    /// <summary> /// 将HTML去除 /// </summary> /// <param name="Htmlstring">&l ...

  8. ansible源码安装

    一.升级python 笔者系统为centos6.5,系统默认安装python2.6,虽然ansible官方文档要求python版本为2.6或2.7,然而许多人都说使用2.6可能出现一系列问题,所以作者 ...

  9. urllib2 python3错误？用from urllib import request来代替！

    今天ytkah在一个python3项目要引用urllib2,可是提示ImportError: No module named 'urllib2'错误了.原来是urllib2可以在python2.x适用 ...

  10. 20181220 Oracle程序包基本开发逻辑

    做事情,开始也许比较迷茫,也可能工具不会,也可能语言不会,但不要害怕 多去思考而不是盲目的开始工作,盲目的听从,程序开发都是不断训练自己的思维能力. 做每件事情都是有意义的,思考为什么这么做,这么做的 ...