明天就是4月4号了,根据有关通知精神,在这个特殊的时刻,作为一名普通的站长,也能通过一些行动来表达自己沉痛的心情,让你的网站变成黑白吧。这一节的wordpress美化教程就教你如何让网站变成灰白色。
网站灰白根据相关资料,通用的做法是在适当的位置给你的网站添加几行CSS样式即可。
我测试了以下浏览器,均有效。
谷歌浏览器(80.0..(正式版本))火狐浏览器(74.0)QQ浏览器(10.5.2)浏览器(12.1..0)MicrosoftEdge(……)IE(11...0)如果您的网站是通过wordpress搭建的,您可以在主题根目录下的style.css底部添加以下代码:
/*网站整体灰白*/body{-webkit-filter:grayscale(%);/*webkit*/-moz-filter:grayscale(%);/*firefox*/-ms-filter:grayscale(%);/*ie9*/-o-filter:grayscale(%);/*opera*/filter:grayscale(%);}
代码位置如图我只想图片变灰白:
/*网站图片灰白-Npcink*/bodyimg{-webkit-filter:grayscale(%);/*webkit*/-moz-filter:grayscale(%);/*firefox*/-ms-filter:grayscale(%);/*ie9*/-o-filter:grayscale(%);/*opera*/filter:grayscale(%);}
我只想首页变灰白:
在主题根目录下的index.php文件的?phpget_footer();上面添加以下代码即可:
styletype=text/css/*网站整体灰白-Npcink*/body{-webkit-filter:grayscale(%);/*webkit*/-moz-filter:grayscale(%);/*firefox*/-ms-filter:grayscale(%);/*ie9*/-o-filter:grayscale(%);/*opera*/filter:grayscale(%);}/style
代码位置如图我对IE情有独钟:
/*网站整体灰白-Npcink*/body{-webkit-filter:grayscale(%);/*webkit*/-moz-filter:grayscale(%);/*firefox*/-ms-filter:grayscale(%);/*ie9*/-o-filter:grayscale(%);/*opera*/filter:grayscale(%);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
我是Typecho:
您可以将以下代码添加至主题的footer.php文件底部/body标签前保存即可。
styletype=text/css/*网站整体灰白-Npcink*/body{-webkit-filter:grayscale(%);/*webkit*/-moz-filter:grayscale(%);/*firefox*/-ms-filter:grayscale(%);/*ie9*/-o-filter:grayscale(%);/*opera*/filter:grayscale(%);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}/style.css
代码放置位置如图我是……
方法大同小异,重要的是这几行CSS代码和注释,具体的方法还请您自行研究。
我不想用这个效果了:
如果您不需要用到这个灰白效果,那么将您之前添加的代码删掉后保存即可。
保存后记得刷新本地浏览器缓存或者CDN哟