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

原效果(例):

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

目标效果(例):

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%); 
}

© 版权声明
THE END
如果内容对您有所帮助,就支持一下吧!
点赞0 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容