兼容多种浏览器的渐变颜色背景经常有一些时候需要使用渐变背景,使用长条图片有点太不高大上了,于是自己写了个小例子,兼容多浏览器就要为每一个浏览器写对应的 CSS,太低版本的浏览器只能使用图片做背景。下面是当前五大浏览器对 gradient 的支持Css代码<styletype="text/css"media="screen">#gradient{width:200px;height:200px;/*如果浏览器不支持渐变,使用图像作为背景*/background:url(gradient.jpg);/*Webkit:Safari4-5,Chrome1-9*/background:-webkit-gradient(linear,0%0%,0%100%,from(#ff6600),to(#339900));/*Webkit:Safari5.1+,Chrome10+*/background:-webkit-linear-gradient(top,#ff6600,#339900);/*Firefox3.6+*/background:-moz-linear-gradient(top,#ff6600,#339900);/*Opera11.10+*/background:-o-linear-gradient(top,#ff6600,#339900);/*IE10*/background:-ms-linear-gradient(top,#ff6600,#339900);/*IE<10*//*注意:这一行必须写在最后*/FILTER:PRogid:DXImageTransform.Microsoft.Gradient(startColorStr=#ff6600,endColorStr=#339900);}</style>Html代码<divid="gradient"></div>啥时没有IE6,啥时世界算太平啊。万恶的IE。