只需要給網站加個濾鏡就可以解決，通過幾行程式碼就可以實現網頁變灰這個功能。

• 方法一

在common.css中新增：

html {
  filter:grayscale(100%);
  /* 下面這句：IE下的濾鏡，如果直接寫上面的屬性，在IE下是無法實現的，所以需要加上下面這句，括號中是需要的屬性 */
  filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}

• 方法二

如果檔案較少，也可以在內部樣式表中新增：（也可新增內聯樣式）

<style>
html {
  filter:grayscale(100%);
  /* 下面這句：IE下的濾鏡，如果直接寫上面的屬性，在IE下是無法實現的，所以需要加上下面這句，括號中是需要的屬性 */
  filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
}
</style>
 

說到底，以上方法都是修改css樣式中的filter，來實現頁面變成灰色 ，那麼我們來了解下filter這個屬性吧。

這個css3的屬性以前從來沒有接觸過,很神奇,屬性叫做filter濾鏡。
filter 屬性定義了元素(通常是<img>)的可視效果(例如：模糊與飽和度)，預設值為none。
本次使用到的是grayscale(%)：將影象轉換為灰度影象。值定義轉換的比例。值為100%則完全轉為灰度影象，值為0%影象無變化。值在0%到100%之間，則是效果的線性乘子。若未設定，值預設是0。