• 强大的 CSS:filter
• filter: none
• filter: blur(2px) 高斯模糊(不接受百分比)
• filter: brightness(70%) 调节明暗(支持百分比，支持小数，可以超过1)
• filter: contrast(50%) 对比度;
• filter: grayscale(80%) 灰度;
• filter: sepia(50%) 将图像转换为深褐色

7、Css之图片变色

强大的 CSS:filter

CSS滤镜（filter）属提供的图形特效，像模糊，锐化或元素变色。过滤器通常被用于调整图片，背景和边界的渲染。

filter: none

没有任何效果，默认filter就为none

filter: blur(2px) 高斯模糊(不接受百分比)

给图像一个高斯模糊效果，length值越大，图像越模糊

filter: brightness(70%) 调节明暗(支持百分比，支持小数，可以超过1)

让图片看起来更亮或者更暗,

filter: contrast(50%) 对比度;

调整图像的对比度，值是0%的话，图像会全黑。值是100%，图像不变。值可以超过100%，意味着会运用更低的对比。若没有设置值，默认是1。

filter: grayscale(80%) 灰度;

将图像转换为灰度图像。值定义转换的比例。值为100%则完全转为灰度图像，值为0%图像无变化。值在0%到100%之间。若未设置，值默认是0。

filter: sepia(50%) 将图像转换为深褐色

将图像转换为深褐色。值定义转换的比例。值为100%则完全是深褐色的，值为0%图像无变化。值在0%到100%之间。若未设置，值默认是0。