IE滤镜渐变不显示错误的颜色

时间:2011-10-13 03:06:08

标签: css

我有一些链接按钮我正在使用我从Ultimate CSS Gradient Generator生成的CSS3渐变代码。除了IE7-9之外它工作得很好(不用担心IE6)。而不是漂亮的中灰色到深灰色,它呈现出从蓝色到黑色的渐变。使用的代码是:

background: #666666; /* Old browsers */
background: -moz-linear-gradient(top, #666666 0%, #141414 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#666666), color-stop(100%,#141414)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #666666 0%,#141414 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #666666 0%,#141414 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #666666 0%,#141414 100%); /* IE10+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#141414',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #666666 0%,#141414 100%); /* W3C */

要查看它的呈现方式:http://bradmccullough.com.w.jaijaz.co.nz/

我注意到改变显示css元素会改变它但不能指出究竟发生了什么。

感谢。

2 个答案:

答案 0 :(得分:2)

这是因为你在CSS中使用灰色的速记颜色。确保使用#666666。查看样式表的来源,对于IE过滤器,您使用的是#666(尽管在上面的帖子中你说得对。)

答案 1 :(得分:1)

我们最近遇到了类似的问题。我们发现在CSS文件上运行CSS minify会将'#666666'缩短为'#666',导致IE8无法在'filter'属性中呈现正确的颜色值。唯一的选择是将颜色定义为“白色”(我们的问题是'#ffffff')或略微调整颜色,即'#fffffe'以防止以简写形式书写。