例如要給所有的img設置灰色濾鏡：
<style type="text/css">
img{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
</style>
要給所有組件添加濾鏡：把img改爲*即可；
測試代碼：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>哀悼日網頁測試</title>
<style type="text/css">
body{
text-align:center;
}
*{
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
filter: gray;
}
</style>
</head>
<body >
<font color="red" size="5">用來測試在特定時期把網頁都是設置爲灰色</font>
<ul style="list-style:none;">
<li><img src="img1.jpg"/></li>
<li><img src="img2.jpg"/></li>
<li><img src="img3.jpg"/></li>
</ul>
<font color="blue" size="5">牛八少爺測試</font>
</body>
</html>
img1,img2,img3是可以設置自己的圖片路徑