在發(fā)生重大哀悼事件時(shí)候，需要緊急將網(wǎng)站變灰以示哀悼，在此蟲蟲給大家總結(jié)了幾種方法，通過簡(jiǎn)單修改一下站點(diǎn)樣式即可實(shí)現(xiàn)。
修改源碼
另外主要方便快捷的方法是使用css樣式的grayscale()方法。
grayscale() : 對(duì)圖片進(jìn)行灰度轉(zhuǎn)換，grayscale是 <filter-function> 的子屬性，當(dāng)100%參數(shù)時(shí)候的效果如下：
最簡(jiǎn)單地把頁面的<html>開始標(biāo)簽中間之間加：
style="-webkit-filter: grayscale(100%);"
或者修改站點(diǎn)CSS樣式
html {-webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(graysale=1);}
將上述代碼添加加到CSS最頂端就可以實(shí)現(xiàn)。
為了兼容多種瀏覽器標(biāo)準(zhǔn)，可以增加一下樣式：
html {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);
_filter:none;
}
如果網(wǎng)站后臺(tái)無法定義CSS樣式，這需要在站點(diǎn)模板頁的head標(biāo)簽中間插入style標(biāo)志位：
<style>
html{-webkit-filter: grayscale(100%);}
</style>
對(duì)于一些老的網(wǎng)站，為了支持該函數(shù)需要修改html標(biāo)頭，將其修改為最新標(biāo)準(zhǔn)標(biāo)頭才可以：對(duì)一些使用Flash（不在建議使用）的老站點(diǎn)，起顏色可能也不支持CSS濾鏡變灰，則需要在可以在FLASH代碼的<object …>和之間插入：
<param value="false" name="menu"/>
<param value="opaque" name="wmode"/>
Nginx代理
對(duì)于一下沒有辦法修改源站代碼的情況下，也可以在Nginx站點(diǎn)代理無服務(wù)器上，通過sub_filter指令來實(shí)現(xiàn)。
受限確保nginx支持http_sub_module模塊，如果不支持需要重新編譯安裝Nginx，自愛安裝時(shí)候添加build參數(shù)—with-http_sub_module
然后在Nginx的http模塊增加如下代碼：
sub_filter '</head>' '<style type="text/css">html{ -webkit-filter: grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}</style>';sub_filter_once on;
然后nginx -t測(cè)試配置正常無誤
nginx -s reload 重啟nginx即可
