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

This article is about whether css3 can remove the color from the image. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.

Css3 can remove the color of the picture; you can use filter with the grayscale attribute to remove the color of the picture, the filter attribute is used to define the visual effect of the element, and the grayscale attribute can convert the image into a grayscale image with the syntax of "picture element {filter:grayscale}".

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

Css3, can you remove the color from the picture?

Css3 can remove the color from the picture.

The filter attribute defines the element (usually the

Visual effects (for example, blur and saturation).

The syntax is:

Filter: none | blur () | brightness () | contrast () | drop-shadow () | grayscale () | hue-rotate () | invert () | opacity () | saturate () | sepia () | url ()

Where:

Grayscale (%)

You can convert an image to a grayscale image. Value defines the scale of the conversion.

A value of 100% completely converts to a grayscale image, while a value of 0% does not change the image. A value between 0% and 100% is a linear multiplier of the effect. If not set, the default value is 0

Examples are as follows:

Img {filter: grayscale;}

Decolorize the image:

Output result:

Thank you for reading! This is the end of the article on "can css3 remove the color of the picture". 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.