CSS3的filter属性详解

filter 属性定义了元素(通常是，也可是文字块，整块)的可视效果(例如：模糊与饱和度)。

filter: none | blur(px) | brightness(%) | contrast(%) | drop-shadow(h-shadow v-shadow blur spread color) | grayscale(%) | hue-rotate(%) | invert(%) | opacity(%) | saturate(%) | sepia(%) | url(%);
原图：

image.png

设置模糊度 filter: blur(5px)

image.png

设置饱和度（更亮和更暗） filter: brightness(80%);

image.png

设置灰度 (黑白): filter: grayscale(80%);

参考文档：https://www.runoob.com/cssref/css3-pr-filter.html