哀悼日，B站及众多网站如何一键变灰？
纪念英雄、同胞，默哀
今天是清明节，也是国家规定对因新冠肺炎逝去同胞的哀悼日。
首先，向英雄表示敬意；向数字内外和因肺炎影响造成的其他疾病病亡者哀悼；向所有为防疫做出微小工作的普通人表示尊敬。感谢伟大的中国人民。
回到问题，刚登陆腾讯云和 B 站都发现网站变灰了，好奇是如何实现的。
直觉他们不会为了只能使用一天的主题专门开发，切图。而效果又是全站同时变灰，因此猜测是使用了 CSS 的某个滤镜，作用在根组件。
简单找了一下就发现了，下面这段 CSS 放上即可。
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
其实很简单，但用在这样的仪式上，让人感觉很用心。
Last modified on 2020-04-03