前言

CSS3 的出现，给我们带来很多很多神奇的东西，其中一个非常酷炫的功能就是filter，

上图的高斯模糊的效果就是通过filter实现的。接下来让我看看他的神奇之处吧。GO GO Go！！！

filter

我们先来一张原图

好酷的，有没有。简直酷的一批。=͟͟͞͞ʕ•̫͡•ʔ

// html<img class="filter" src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/90294544a3c944e5b2c2c6c174fdb57f~tplv-k3u1fbpfcp-zoom-1.image">

blur

使图片达到高斯模糊的效果。参数可以指定为 CSS 长度，但不接受百分比值。传入的数值表示屏幕上有多少像素相互融合，传入的数值越大，图像越模糊，反之，图像越清晰，默认值是0.

// css.filter {    filter：blur(10px);}

brightness

可以使图片变亮或者变暗，参数为 0％(0)时全黑。参数为 100％(1) 图像不变。参数大于 100%(1)时提高图片亮度。默认值是 1。

// css.filter {    filter：brightness(0.4);}

// css.filter {    filter：brightness(1.4);}

contrast

调整图片的对比度，参数为 0％(0)时全黑。参数为 100％(1) 图像不变。参数大于 100%(1)时提高图片亮度。默认值是 1。`

// css.filter {    filter: contrast(0.6);}

// css.filter {    filter: contrast(1.6);}

真的很酷也，感没感觉到，帅炸了！(^o^)

好，今天就到这里了，今天努力的你依然是最棒的。Bye Bye！！！