• 欢迎来到主题派官网,主题源码,插件,模板下载。所有主题及插件资源不负责技术支持,售出不退!
主题派主题派  2023-06-19 11:57 主题派 隐藏边栏 |   抢沙发  5 
文章评分 0 次,平均分 0.0

在这个特殊的时刻,作为一名普通的站长,我们也能通过一些行动来表达自己沉痛的心情,让你的网站变成黑白吧。这一节的 wordpress 美化教程教你如何让你的 wordpress 网站变成灰白色

明天就是 4 月 4 号了,根据有关通知精神,在这个特殊的时刻,作为一名普通的站长,我们也能通过一些行动,来表达自己沉痛的心情,让你的网站变成黑白吧。这一节的wordpress 美化教程就教你如何让网站变成灰白色。

根据相关资料,通用的做法是在适当的位置给你的网站添加几行 CSS 样式即可。

我测试了以下浏览器,均有效。

  • 谷歌浏览器(80.0.3987.149(正式版本))
  • 火狐浏览器(74.0)
  • QQ 浏览器(10.5.2)
  • 360 浏览器(12.1.2248.0)
  • Microsoft Edge(……)
  • IE(11.719.18362.0)
<style> html{overflow-y:scroll;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%);} </style>
/*网站整体灰白*/ body { -webkit-filter: grayscale(100%); /* webkit */ -moz-filter: grayscale(100%); /*firefox*/ -ms-filter: grayscale(100%); /*ie9*/ -o-filter: grayscale(100%); /*opera*/ filter: grayscale(100%); }

我只想图片变灰白:

/*网站图片灰白 - Npcink*/ body img{ -webkit-filter: grayscale(100%); /* webkit */ -moz-filter: grayscale(100%); /*firefox*/ -ms-filter: grayscale(100%); /*ie9*/ -o-filter: grayscale(100%); /*opera*/ filter: grayscale(100%); }

我只想首页变灰白:

在主题根目录下的index.php文件的

<?php get_footer();

上面添加以下代码即可:

<style type="text/css"> /*网站整体灰白 - Npcink*/ body { -webkit-filter: grayscale(100%); /* webkit */ -moz-filter: grayscale(100%); /*firefox*/ -ms-filter: grayscale(100%); /*ie9*/ -o-filter: grayscale(100%); /*opera*/ filter: grayscale(100%); } </style>

我对 IE 情有独钟:

/*网站整体灰白 - Npcink*/ 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); }

我是 Typecho:

您可以将以下代码添加至主题的footer.php文件底部</body>标签前保存即可。

<style type="text/css"> /*网站整体灰白 - Npcink*/ 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); } </style.css>

我是……

方法大同小异,重要的是这几行 CSS 代码和注释,具体的方法还请您自行研究。

指定时间有效果:

//网站整体变灰 function make_all_page_grep(){ $dates = array("2020-04-04"); $should_show = false; foreach ($dates as &$value) { $should_show= $value == date('Y-m-d'); } unset($value); if ($should_show) { $styles = ""; $styles .= "html{overflow-y:scroll;filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1); -webkit-filter: grayscale(100%);}"; echo "<style>" . $styles . "</style>"; } } add_action("wp_head", "make_all_page_grep"); 

我不想用这个效果了:

如果您不需要用到这个灰白效果,那么将您之前添加的代码删掉后保存即可

保存后记得刷新本地浏览器缓存或者 CDN 哟

「点点赞赏,手留余香」

还没有人赞赏,快来当第一个赞赏的人吧!

主题派给主题派打赏
×
予人玫瑰,手有余香
  • 2
  • 5
  • 10
  • 20
  • 50
2
支付
悼念时刻让网站变灰白 - WordPress 美化 为主题派网版权所有,转载请注明出处,所有资源不提供技术支持。
主题派
主题派 关注:0    粉丝:0
Wordpress主题,插件,源码商城

发表评论

表情 格式 链接 私密 签到 常用语
扫一扫二维码分享
×
艾瑞克网