火狐浏览器:

background:-moz-linear-gradient(top, red, rgba(0, 0, 255, 0.5));

谷歌:

.l6{background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FF0000), to(#F9F900)); }  谷歌10+

.l7{background: -webkit-gradient(linear, left top, right top, color-stop(0%,#30c6e0), color-stop(100%,#1e77db));} 谷歌1-9

不带前缀:

.l1{background: linear-gradient(to bottom, blue 2%, white 50%, orange);}

.l2{background: linear-gradient(to bottom right, blue 2%, white 50%, orange);}

.l3{background: linear-gradient(20deg, blue 2%, white 50%, orange);}

多个背景

.l5{background:url(http://pinqu.qiniudn.com/sq_daas_c5caf34a66473182975d1595c623a037) no-repeat 0 0/100% 100%;}
.l4{background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,1)), url(http://pinqu.qiniudn.com/sq_daas_c5caf34a66473182975d1595c623a037) no-repeat 0 0/100% 100%;}

参考来源:http://www.cnblogs.com/lhb25/archive/2013/01/30/css3-linear-gradient.html

css3线性渐变兼容的更多相关文章

  1. css3 线性渐变和径向渐变

    线性渐变:ie6以下不兼容 径向渐变:只支持firefox.Chrome和Safari <!DOCTYPE html> <html> <head> <meta ...

  2. 【CSS3】使用CSS3线性渐变实现图片闪光划过效果(转)

    原文:http://www.nowamagic.net/librarys/veda/detail/2600 资料参考: http://www.cnblogs.com/lhb25/archive/201 ...

  3. css线性渐变兼容

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

  4. CSS3 线性渐变(linear-gradient) 兼容IE8,IE9

    一.线性渐变在 Mozilla 下的应用     语法: -moz-linear-gradient( [<point> || <angle>,]? <stop>, ...

  5. CSS3 线性渐变linear-gradient

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径 向渐变).为了更好的应用 CSS3 Gradient,需要先了解一下目前的几种现代浏 ...

  6. 使用CSS3线性渐变实现图片闪光划过效果

    <p class="overimg"> <a><img src="http://www.nowamagic.net/librarys/ima ...

  7. CSS3线性渐变linear-gradient

    转自 http://www.w3cplus.com/content/css3-gradient CSS3的线性渐变 一.线性渐变在Mozilla下的应用 -moz-linear-gradient( [ ...

  8. CSS3 线性渐变(linear-gradient)

    CSS3 Gradient 分为 linear-gradient(线性渐变)和 radial-gradient(径向渐变).而我们今天主要是针对线性渐变来剖析其具体的用法.为了更好的应用 CSS3 G ...

  9. CSS3线性渐变和径向渐变

    background:linear-gradient(to top left, blue,orange);//从右下角往左上角渐变 background:radial-gradient(to top ...

随机推荐

  1. 【工具类】Date、Long、String 类型互转

    开发常常遇到Date.Long.String 三种类型数据须要互转的问题.以此记录. public static void main(String[] args) throws ParseExcept ...

  2. Xshell 一款很养眼的配色方案推荐

    Xshell 是个很好用的在 windows 下登陆 liunx 的终端原生支持中文,配合 Xftp 管理文件,同是免费软件可远比 Putty 好用多了面对枯燥的代码,我们需要一款很养眼的配色方案来保 ...

  3. .NET面试题汇总

    目录 本次给大家介绍的是我收集以及自己个人保存一些.NET面试题 简介 1.C# 值类型和引用类型的区别 2.如何使得一个类型可以在foreach 语句中使用 3.sealed修饰的类有什么特点 4. ...

  4. robotframework使用之 下拉框的选择

    选择下拉框有几种方式处理,首先在浏览器F12选择下拉框 1. F12后看见下拉框的源码是<option xxx> <select class="w_60" dat ...

  5. css hover对其包括的元素进行样式设置

    <ul class="icon-down-single-arr-li"> <li> <a href="javascript:void(0)& ...

  6. 从0开始学习 GitHub 系列汇总笔记

    本文学习自Stromzhang, 原文地址请移步:从0开始学习 GitHub 系列汇总 我的笔记: 0x00  从0开始学习GitHub 系列之[初识GitHub] GitHub 影响力 a.全球顶级 ...

  7. hdu 1068 Girls and Boys 二分图的最大匹配

    题目链接:pid=1068">http://acm.hdu.edu.cn/showproblem.php? pid=1068 #include <iostream> #in ...

  8. JVM中垃圾收集选项

    最初并发垃圾收集被引入的时候,激活并发垃圾收集的命令选项是: -XX:+UseParallelGC 增强的并行收集和Java 6一起发布,通过一个新的命令行选项: -XX:+UseParallelOl ...

  9. arcgis10.0 切片并发布服务及验证

    1.切片参考网址:https://jingyan.baidu.com/article/fa4125accc6bef28ac7092d7.html 2.通过下面代码验证  参考网址https://www ...

  10. MySQL -- Ubuntu下的操作命令

    =======================安装======================参照MySQL官网的步骤:https://dev.mysql.com/doc/mysql-apt-repo ...