要给一个元素应用高斯模糊,我们只需要指定blur作为滤镜类型,括号内的值为模糊的半径。为了证明这一点,我们将为Stuff & Nonsense网站的banner背景上使用blur

.filter { 
filter : blur(5px); }

1701.tif

Stuff & Nonsense网站使用模糊来区分开banner背景。

模糊滤镜的半径可以使用任何CSS单位,所以我们可以使用pxemrem,甚至cm。数字越大,应用的半径越大,滤镜效果也越强。但是不能使用百分比。当我们输入无效值时,浏览器会默认应用none

要想获得看起来自然的效果,需要设定一个合适的值,这有些困难,但是当我们想使用滤镜时,第一个想到的就是模糊效果,因为在CSS中使用它非常简单。