CSS在不同浏览器下实现颜色渐变效果

 想做一个首页巨幕,又不想用图片,这样速度会慢掉一点点,纯色挺丑的,只好试试渐变效果咯。CSS 3有很好的颜色渐变支持,要应付一些老旧的浏览器,还是要几行代码滴。

 整理如下:

1
2
3
4
5
6
7
8
9
10
11
    background-image: -moz-linear-gradient(top#ff4f02#8f2c00);
    /* Firefox */
     
    background-image: -webkit-gradient(linear, left topleft bottom, color-stop(0#ff4f02), color-stop(1#800000));
    /* Safiri 4+, Chrome */
     
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff4f02',endColorstr='#8f2c00');
    /* IE 6 7 8 9 */
     
    background: -ms-linear-gradient(top#ff4f02#8f2c00);
    /* IE 10 */

 效果是酱紫的:

  

CSS在不同浏览器下实现颜色渐变效果










本文转自 iampomelo 51CTO博客,原文链接:http://blog.51cto.com/iampomelo/1655408,如需转载请自行联系原作者
上一篇:基础设施助力双11(一):X86 CPU的定制和演进


下一篇:犀利的background-clip:text,实现K歌字幕效果