2020年4月4日国家哀悼日把网站变灰色修改方法和代码

2020-04-03

2020年4月4日国家哀悼日恰逢清明，通过下面几种修改html的css样式代码方法，可以让网站和网页全部变成灰色，悼念2020年新冠肺炎死去的同胞寄托哀思。下面是样式代码，根据自己需要修改即可。

第一种方法：修改全站

找到您网站里面的.css文件，修改这个css文件，把下面的代码加到最后面一行，保存FTP传到香港空间即可，清空浏览器缓存就看到了。

*{
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}

第二种方法：同上

html {-webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}

第三种方法：当网站不用css文件时可用

当网站不用css文件时候，可以直接网页上插入这个代码放在在<head>和</head> 之间之间

该方法针对新款浏览器例如Chrome、EDGE、Safari

<style>
*{
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}
</style>

该方法针对IE旧款浏览器，如果您网站不是html5的

<style>
html{filter:progidXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>

第四种方法：跟第一种一样，可以放在css文件最后一行

跟第一种一样，可以放在css文件最后一行

html{ filter: grayscale(100%); 
-webkit-filter: grayscale(100%); 
-moz-filter: grayscale(100%);
 -ms-filter: grayscale(100%); 
-o-filter: grayscale(100%);
 filter: url("data:image/svg+xml;utf8,#grayscale");
 filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); 
-webkit-filter: grayscale(1);}