Shulou(Shulou.com)06/02 Report--

This article is about how css sets the Gaussian blur effect. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

In css, you can use the filter attribute and the blur () function to achieve the Gaussian blur effect, the filter attribute is used to set the visual effect of the picture element, and the blur () function is used to add the Gaussian blur effect to the picture element. the syntax is "picture element {filter:blur (fuzzy value);}".

The operating environment of this tutorial: windows7 system, CSS3&&HTML5 version, Dell G3 computer.

We can set Gaussian blur to the picture through the filter filter property, and the filter attribute defines the element (usually

Visual effects (for example, blur and saturation).

Sets Gaussian blur to the image when the attribute value is blur (px). The value of "radius" sets the standard deviation of the Gaussian function, or how many pixels are blurred together on the screen, so the higher the value, the more blurred.

If no value is set, the default is 0; this parameter sets the css length value, but does not accept the percentage value.

Let's take a look at this through an example:

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

Output result:

Thank you for reading! This is the end of the article on "how to set the Gaussian blur effect in css". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.