全网站灰度，教你一行代码实现全站变灰处理

原网站

变灰后
只需要一行代码就可以实现

在全局样式中加入filter: grayscale(100%);//转换灰度

那么原理是什么呢？

我们都知道在css函数中有一个grayscale，可以把图像转成灰色，参数根据百分比来调整的，结果返回的是filter函数。filter 函数可以用来改变图像的显示效果，用于 CSS 的 filter 属性。

当然还有其它的一些处理函数

例如下列

blur() /*适用于模糊图像*/

brightnes()  /*适用于让图像变得更亮或者更暗，用于色调处理*/

contrast() /*适用于增加或者减少图像的对比度*/

drop-shadow() /*适用于给图像添加阴影增加*/

hue-rotate() /*适用于更改整体色调*/

invert() /*适用于反转图像的颜色*/

opacity() /*适用于图像透明度的调整*/

saturate() /*适用于对图形进行超饱和度或者去饱和度处理*/

sepia() /*适用于将图像转换为棕褐色*/

当然这一切都不兼容ie浏览器