CSS 使图片变灰的实例

概述最近项目中遇到个问题，就是要使图片变灰。我想了几种解决方案。1 一种是图片之间的替换，也就是将正常的图片再做成灰色的。这种方法应该是最稳定的了，但是就要花费时间去做多余的那些图片了。应该算是比较费事的那种，程序员嘛，都比较懒，喜欢让计算机干更多的事情。2 …

　　最近项目中遇到个问题，就是要使图片变灰。我想了几种解决方案。

　　1 一种是图片之间的替换，也就是将正常的图片再做成灰色的。这种方法应该是最稳定的了，

　　但是就要花费时间去做多余的那些图片了。应该算是比较费事的那种，程序员嘛，都比较懒，

　　喜欢让计算机干更多的事情。

　　2 于是又想到了第二种，就是用CSS来解决问题，上网一搜还真有。 将“filter：gray;”添加到图片的样式中就可以了。

　　这是应用了滤镜的效果。

　　

　　对于IE用户这个问题是解决了，但在firefox下就不起作用了。问题在于IE有滤镜的支持，而firefox就没有。

　　后来只能是在firefox下将图片半透明显示，也能起到满意的效果。

　　"filter：gray; -moz-opacity:.1;opacity:0.1;"

　　这行代码在IE下图片变为灰色，在firefox下半透明显示。

　　filter：gray 这个属性只有IE支持，-moz-opacity这个属性firefox低版本支持，opacity高版本支持

　　”filter: Alpha(opacity=10);-moz-opacity:.1;opacity:0.1;“

　　这行代码在IE和firefox下都半透明显示 。

总结

以上是内存溢出为你收集整理的CSS 使图片变灰的实例全部内容，希望文章能够帮你解决CSS 使图片变灰的实例所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。