使用CSS实现网站黑白效果

效果大家都看到了,就是我网站现在这样子,淘宝啥的也黑白了。其实原理很简单,加个CSS滤镜。更简单的说,只要在你的网站的<body>里面加上下面一段代码,不同于网上其他代码,下面的代码Chrome、火狐(IE10暂时无解)都适用(阿里妈妈的代码就是只适用于Chrome)

<!——————–请自动无视本行和最后一行

<style type=”text/css”>
html {
filter: url(“data:image/svg+xml;utf8,<svg%20xmlns=’http://www.w3.org/2000/svg’><filter%20id=’grayscale’><feColorMatrix%20type=’matrix’%20values=’0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200’/></filter></svg>#grayscale”); /* Firefox 3.5+ */
filter: gray !important; /* IE6+ */
filter: grayscale(100%); /* Current draft standard */
-webkit-filter: grayscale(100%); /* New WebKit */
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
}
* {
filter: gray !important; /* IE6+ */
}
</style>

—————————————–>

发表评论

电子邮件地址不会被公开。 必填项已用*标注