CSS设置整个页面为黑白调，也可设置部分页面

原效果(例)：
目标效果(例)：
CSS核心代码：
 filter: grayscale(100%);

1、设置整个网页为黑白调

html {
       filter: grayscale(100%);/*核心代码*/
       -webkit-filter: grayscale(100%); /*增加兼容性前缀*/
       -o-filter: grayscale(100%); 
       -ms-filter: grayscale(100%); 
       -moz-filter: grayscale(100%); 
}

2、设置部分内容为黑白调

div {
       filter: grayscale(100%);
       -webkit-filter: grayscale(100%);
       -o-filter: grayscale(100%); 
       -ms-filter: grayscale(100%); 
       -moz-filter: grayscale(100%); 
}
.myClass {
       filter: grayscale(100%);
       -webkit-filter: grayscale(100%); 
       -o-filter: grayscale(100%); 
       -ms-filter: grayscale(100%); 
       -moz-filter: grayscale(100%); 
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容