CSS Demo网站页面变灰

Posted 2020-08-30

让网站所有元素变成灰色调，全浏览器支持，使用了滤镜，比较吃性能，建议作临时方案使用。

实现效果（点击下面的按钮）：

这里放一张图片作为效果展示：

其CSS代码如下：

body{
  -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);
  filter:gray;
  -webkit-transform: translateZ(0);
}

 

来源：网站变灰 CSS