一行css代码让网站变灰(悼念模式)

在发生重大灾难时,可能有让网站变灰的需求,利用css属性filter 可实现一键变灰:
html {
filter:grayscale(1); //把当前元素及其后代元素设置成100%的灰度模式
}
建议直接给html标签定义filter样式
兼容旧版浏览器写法:
// 现代浏览器
.gray {
filter: grayscale(1);
}
// 旧浏览器
.gray {
-webkit-filter: grayscale(1); /* Old Chrome、Old Safari、Old Opera*/
filter: grayscale(1); /* 现代浏览器标准 */
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); /* IE */
}
版权声明:
作者:东明兄
链接:https://blog.crazyming.com/note/2327/
来源:CrazyMing
文章版权归作者所有,未经允许请勿转载。


共有 0 条评论