网站一秒变灰色,是怎么实现的

很多网站、APP 在重大灾难发生后立马就变灰色了。

你是否好奇这种灰色是怎么实现的呢?

如果换一套灰色的UI,有些不现实,工作量巨大;

实现方法其实很简单,就是给整个网页加了一层滤镜效果,只需要ctrlCV就实现啦。

下面是具体的实现方法:

-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

讲上面这段样式加到HTML标签上,即可。

我们在网页上测试一下,按F12,开发者模式,选中最外层HTML标签,添加以上样式。

猜你喜欢

转载自blog.csdn.net/qq_38679823/article/details/129025826
今日推荐