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

文章转载来自:香港空间


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