-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\' x=\'0\' y=\'0\' width=\'100%\' height=\'100%\'><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;
可以使webkit浏览器整体变灰，等同于滤镜。
以上代码不支持IE11
IE11可使用JQ插件解决
先引入JQ
<script src="http://james.padolsey.com/demos/grayscale/grayscale.js"></script>
grayscale(document.getElementsByTagName("img"));
另两款JQ插件
https://gianlucaguarini.com/jQuery.BlackAndWhite/
https://work.karlhorky.com/gray/
