马上就加载好了...
王佳冬中文博客

把网页变成黑白色的几种办法

by on Apr 22 , 2013 , under 公益, 学术 , 120 views , Leave a Comment , 网址太长?

08年的时候大家都喜欢把自己的网页搞成黑白色,以示“潮流”,如今这种情况再次出现了,暂且不管灾不灾的问题,先来看看有几种实现的方式吧。

heibai

css3灰度滤镜实现

css3有一个叫做greyscale 的滤镜,可以让网页瞬间变成黑白的,只要在css文件最顶端加入以下样式即可:

-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;

优点:一键添加,打通所有浏览器

缺点:不支持css3的浏览器就无法看到了

IE灰度滤镜实现

在没有css3之前,往往都是用一种滤镜去瞬间让网页变成黑白,想必很多站长都见过这个css代码:

filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);

如果不高兴弄css文件的话,那就在网页头部加上一段简单的代码:

<style>
html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
</style>

优点:使用网页标准协议,门槛比较低

缺点:仅在IE内核下生效,其他内核浏览器无效

逐个编辑css样式和图片

这个方法就不多作介绍了,大公司的做法,就是逐个css样式修改,每张图片和flash去修改,如果网站很大的话工程量是很大的,当然现在大家的做法是只改首页。

如果是像我这样的独立wordpress博客,其实完全可以做一个灰色的主题包,曾经在2009年就制作过一个海地地震祈福的灰色主题包(详见头图),虽然一次修改的工程量比较大,但是长久下去的话就非常方便,替换样式文件便是。

优点:可逐个模块自定义,也不存在浏览器兼容问题

缺点:费时费力

你可能喜欢的博文:
 

沙发竟然还没被抢!


赶快说点什么吧! ^_^