網站灰色顯示如何實現

下面小編給大家分享一個網站全灰功能的實現方式，希望能到大家

東西/原料

1
之前在w3c教程里面見過一個css濾鏡結果，代碼就是直接圖片灰色的，我可以測驗考試革新當作全網頁灰色
2
上圖可以，看到焦點代碼就是 filter: grayscale(100%);可是為了可以或許施印多瀏覽器，還得插手-webkit-filter: grayscale(100%); /* Chrome, Safari, Opera */
3
然后我們可以運行一下官網案例，看看圖片灰色的區別，下面代碼放了兩張圖，原圖和灰色結果圖
4
上面我們把樣式代碼放在了圖片里面，若是要實現全網站灰色，那么就把他放在html里面就行了，如圖隨便找一個網站，彩色的
5
F12,找到html節點，然后里面輸入style="filter: grayscale(100%);"
6
回車之后，全網站都灰色了
END