四川汶川地震,牵动着全国人民的心,人们通过各种途径表达自己对灾区人民关心,通过网页表达对灾区人民受害者人民的哀悼,是其中的一种方法。5月19日、20日、21日,是全国哀悼日,除了默哀3分钟之外,我们可以把我们的网页变成黑白的颜色。
办法有多种,如果你想将页面中的所有元素都变成黑白色,可以在页面中添加下面的样式:
<style type="text/css">
html,body { filter : gray ; }
</style>
html,body { filter : gray ; }
</style>
如果只想改变其中一部分,可以采用class的定义。如果在黑白的页面中,加入一个红色的蜡烛,在表达哀思的同时,祈求祝福,可以采用下面的方法(效果参见http://dotnet.aspx.cc/):
<
style
type
="text/css"
>
a,p,div,input,img,span,td,font,table,hr,h3,h2,h4,h5,h1 { filter : gray }
html,body {background:;}
.noFilter { filter :; }
</ style >
< div style ="text-align:center;padding-top:10px;" >
< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />
</ div >
< div style ="text-align:center;" >
< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />
</ div >
a,p,div,input,img,span,td,font,table,hr,h3,h2,h4,h5,h1 { filter : gray }
html,body {background:;}
.noFilter { filter :; }
</ style >
< div style ="text-align:center;padding-top:10px;" >
< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />
</ div >
< div style ="text-align:center;" >
< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />< img src ="http://dotnet.aspx.cc/Images/f.gif" class ="noFilter" />
</ div >
需要注意的是:以上方法只适用于 IE 浏览器,非 IE 浏览器,需要全面修改页面中的样式和图片等。