哀悼日黑白网页背景设置教程
7865次阅读
610人点赞
发布时间: 2021-12-14 09:20:07
扫码到手机查看
![]()
通用的一般方法
不能忘却的悼念：今天是国家公祭日，我将网站整体变为了黑白色，以表示对南京大屠杀死难者的悼念。勿忘，不忘！
下面将代码分享给大家：
黑白色CSS代码
html{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}很简单，可以在网页/模板的HTML代码<head>和</head>之间插入，注意：要加上<stytle></stytle>，否则不起效果。
有一些站长的网站可能使用这个CSS不能生效，是因为网站没有使用最新的网页标准协议，网上复制下最新网页标准协议替换即可。
<!DOCTYPE html><html><head><meta charset="utf-8">...手机、PC和IE
更改Meta
<meta http-equiv=”X-UA-Compatible”content=”IE=9,chrome=1″>在<head>中添加CSS
<style>
html{
-webkit-filter: grayscale(100%); /* webkit */
-moz-filter: grayscale(100%); /*firefox*/
-ms-filter: grayscale(100%); /*ie9*/
-o-filter: grayscale(100%); /*opera*/
filter: grayscale(100%); /*ie9- */
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter:gray;
}
</style>IE（注意IE必须是*才可以）如果是IE，那么需要将上下两段代码都加入到你的文件中。
<!--[if IE]>
<style>
*{
-webkit-filter: grayscale(100%); /* webkit */
-moz-filter: grayscale(100%); /*firefox*/
-ms-filter: grayscale(100%); /*ie9*/
-o-filter: grayscale(100%); /*opera*/
filter: grayscale(100%); /*ie9- */
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter:gray;
}
</style>
<![endif]-->
目录