网页变灰色

今天是 2020 年 4 月 4 日，星期六，清明节。

我们的国家经历了非常惨痛的时刻，很多英雄在救助他人的路上倒下，更有很多烈士英雄保卫人民的安危遇难，今天全国下降半旗，北京时间 10 点全国默哀三分钟，来致敬英雄们。同时今天一切公共娱乐活动也都会停止，包括直播、综艺、影视、游戏等等。

我也在这里也向全国抗击新冠肺炎疫情斗争牺牲的烈士和逝世的同胞表达深切的哀悼，向所有在抗战在疫情前线的工作和医护人员致敬。我们每一个人的平安面前，都是英雄的人墙。

网站变灰

今天大家可以看到很多很多网站包括主页和内容也都已经变成了灰色，比如百度、B 站、爱奇艺、CSDN 等等。通过浏览器的开发者工具观察和点击勾选样式后发现有这么一段变灰色的css代码。

// B站的
html.gray {
    -webkit-filter: grayscale(.95);
}

-

// CSDN的
html {
    -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 {
    filter: grayscale(100%);
}

至此又学习到了点新知识

尾巴

分享个MDN的测试demo链接，里面有更多东西学习
https://developer.mozilla.org/zh-CN/docs/Web/CSS/filter