多的不说,直接代码,增加键盘使用寿命
html,body,div,img{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
filter: progid: DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter: gray;
}
说明;因为该CSS样式对图片进行滤镜操作,所以PNG图片制作时尽量不要有毛边出现,否则,灰色滤镜化后会比较难看;
此外,html,body,div,img是对有可能进行灰色滤镜化元素的一个归类,若有部分元素不能出现灰色滤镜现象,请查看代码未被滤镜化元素是否被包含其中;
重要说明:此版本代码不支持IE10/11的灰色操作。
此外可以采用JS 【grayscaleJS】来实现网页置灰操作;
送上文件地址:我就是地址,你点啊点啊