网站如何快速变成灰色？，几行代码就搞定了！
生活随笔
收集整理的這篇文章主要介紹了
网站如何快速变成灰色？，几行代码就搞定了！
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
?
- 當大家看到全站的內容都變成了灰色，包括按鈕、圖片等等。這時候我們可能會好奇這是怎么做到的呢？
- 有人會以為所有的內容都統一換了一個 CSS 樣式，圖片也全換成灰色的了，按鈕等樣式也統一換成了灰色樣式。但你想想這個成本也太高了，而且萬一某個控件忘記加灰色樣式了豈不是太突兀了。
- 其實，解決方案很簡單，只需要幾行代碼就能搞定了。通過參考資料，我總結出以下幾個方法可以幫助我們達到目的：
- 使這個網頁的顏色變成灰色的最簡單的方法，就是在當前頁面的css里面。添加下面的代碼，并且讓他在任意的瀏覽器里面正確的執行：
方法一:
<style type="text/css"> html {filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter:grayscale(1) } </style>filter是濾鏡的意思，filter:gray的意思就是說給頁面加上一個灰度的濾鏡，所以html里面的所有內容都會變成黑白的了。不過這個濾鏡對于chrome和safari瀏覽器是無效的，所以下面會有一行-webkit-filter: grayscale(100%);這個樣式是專屬于使用webkit內核的瀏覽器的，意思和FILTER: gray;差不多，只是寫法不同罷了。
方法二：
下面這段代碼可以把網頁變成黑白，將代碼加到CSS最頂端就可以實現素裝，如果網站沒有使用CSS，可以在網頁模板的HTML代碼style之間插入
<style> html {filter: progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);-webkit-filter: grayscale(100%); } </style>有一些網站可能使用這個 css 不能生效，是因為網站沒有使用最新的網頁標準協議，請將網頁最頭部的替換為以下代碼：?
<!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">?還有一些網站 FLASH 動畫的顏色不能被 CSS 濾鏡控制，可以在 FLASH 代碼的和之間插入：
<param value="false" name="menu"/> <param value="opaque" name="wmode"/>給出一段規范的代碼，把這段代碼加入到網站頁面的css里面即可實現頁面變成灰色的效果：
html{-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);-ms-filter:grayscale(100%);-o-filter:grayscale(100%);filter:grayscale(100%);filter:url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1) }原文鏈接：https://blog.csdn.net/YOUYOU0710/article/details/105350655
總結
以上是生活随笔為你收集整理的网站如何快速变成灰色？，几行代码就搞定了！的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 教你使用日文输入法-日文输入显示不用愁
- 下一篇： QQ企业邮箱绑定微信