溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章給大家分享的是有關如何使用CSS將網頁變黑白的內容。小編覺得挺實用的，因此分享給大家做個參考，一起跟隨小編過來看看吧。
很多人都想把自己的網站弄成全站黑白來表示自己的哀悼之情。還有其他特殊原因（比如汶川大地震）對部分事件表示哀悼，所以需要把整個網站設置為灰色或者黑白方格。那么今天就說說，通過幾行簡單的代碼，來實現這個功能。下面我就附上開啟全站黑白的教程和代碼吧，只需要一句CSS定義即可，要將整個網站變成灰色調，你不用去一張一張的改圖片的色調，只需要在css文件的HTML節點上添加下面一條定義。
網頁變黑白方法一：
html{-webkit-filter:grayscale(100%);}
如果你的網站沒有引用css文件，那么就可以直接引用下面這段html代碼
<styletype="text/css">html{-webkit-filter:grayscale(100%);}</style>
上面的CSS代碼可能只對主流瀏覽器支持，如果你需要支持QQ瀏覽器、360瀏覽器、IE瀏覽器等等其他瀏覽器需要使用下面這段：
<style>
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;
}
</style>
網頁變黑白方法二：
下面這段代碼可以變網頁為黑白，將代碼加到CSS最頂端就可以實現素裝，如果網站沒有使用CSS，可以在網頁/模板的HTML代碼和之間插入：
<style>html{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter:grayscale(100%);}</style>
有一些站長的網站可能使用這個css不能生效，是因為網站沒有使用最新的網頁標準協議。
感謝各位的閱讀！關于“如何使用CSS將網頁變黑白”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，讓大家可以學到更多知識，如果覺得文章不錯，可以把它分享出去讓更多的人看到吧！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
