Home >Web Front-end >CSS Tutorial >Share a CSS special effect code that makes the entire site gray
Share a CSS special effect code that makes the entire site gray, a WeChat applet. I would like to share the following
Compatible with mainstream browsers, the CSS code for graying the entire site:
html { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscalerayscale"); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); zoom: 1; }
There are also js grayscale codes available:
grayscale(document.body);
grayscale.js Please search by yourself.
html { -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: url(desaturate.svg#grayscale); filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); }
The above is the detailed content of Share a CSS special effect code that makes the entire site gray. For more information, please follow other related articles on the PHP Chinese website!