一个网站css样式就可以搞定的，你知道吗？

网站已经变得这么灰了，无论是按钮、图片、还是flash动画，都变成了灰色。 这时候我们就会特别好奇，这是怎么做到的呢？

可能有人会认为这是一套提前准备好的网站css样式，今天直接替换掉了。 但这样做的成本太高，尤其是网站上的一些flash动画。 难道还没有必要这样做吗？ 有黑白版本吗？ 这太不现实了。

其实不用想得太复杂。 如果你想把一个网站变成灰色，只需要几行代码就可以解决。 那么我们来看看具体的实现方法。

功能实现

然后我们选择淘宝官网，然后打开浏览器的开发者工具，查看页面源码，选择源码中的标签，在右边的样式中选择样式：

html {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

如果我们取消这个样式，我们会发现网站的颜色又恢复了。

代码审查效果截图

该实现方法具有相对较好的兼容性，主要是兼容各类浏览器。

至此，我们知道，如果我们想让一个网站程序变成灰色，其实只要设置一个全局样式就可以了。