每逢哀悼日，国内许多大型网络平台页面都会变成黑白/灰白色，以示悼念！这里简单记录一下网站实现颜色变黑白/灰白效果的方法。
效果预览
实现方法
方法一
通过修改 style.css 来让网站变成黑白/灰白色。在网站主题的 style.css 文件顶端添加下列代码即可，有些 WordPress 网站主题有自定义 CSS 样式功能，可以直接把代码粘贴进后台，然后保存即可生效，记得要使用“Ctrl+F5”强制刷新。
html {filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%); }
方法二
找到网站主题的 header.php 文件，在 </head> 前插入下列代码将网站改为黑白/灰白色。
<style type="text/css">
html {
filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
-webkit-filter: grayscale(100%);}
</style>
方法三
通过修改 <html> 标签，加入内联样式的方法，实现网页变成黑白/灰白色的效果，使用下面的代码：
<html style="filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%);">
方法四
找到网站主题的 style.css 文件，将下列代码添加到最底部，同样可以实现网站变成黑白/灰白色。
body *{
-webkit-filter: grayscale(100%); /* webkit */
-moz-filter: grayscale(100%); /*firefox*/
-ms-filter: grayscale(100%); /*ie9*/
-o-filter: grayscale(100%); /*opera*/
filter: grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
filter:gray; /*ie9- */
}
方法五
仅仅将网站的首页变成了黑白/灰白色，同样也可以实现；找到网站主题的 functions.php 文件，将下列代码添加到最底部即可。
function nicetheme_global_greyscale() {
if ( is_home() ){
echo '<style type="text/css">html{-webkit-filter:grayscale(1);-webkit-filter:grayscale(100%);filter:grayscale(100%);-webkit-filter:gray;filter:gray;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}</style>';
}
}
add_action('wp_head', 'nicetheme_global_greyscale');
1、本网站名称：缘本初见
2、本站永久网址：https://www.52ybcj.com
3、本网站的文章部分内容可能来源于网络，仅供大家学习与参考，如有侵权，请联系站长进行删除处理。
4、本站一切资源不代表本站立场，并不代表本站赞同其观点和对其真实性负责。
5、本站一律禁止以任何方式发布或转载任何违法的相关信息，访客发现请向站长举报
6、本站资源大多存储在云盘，如发现链接失效，请联系我们我们会第一时间更新。
评论