將整個網站頁面變成灰色(黑白色)
有些時候我們需要把網站頁面變成黑白色或灰色,特別是對於一些需要悼念的日子,以及一些影響力很大的偉人逝世或紀念日的時候,都會讓網站的全部網頁變成灰色(黑白色),以表示我們對逝者或者英雄的緬懷和悼念。通過參考資料,總結出以下幾個方法可以幫助我們達到目的:
方法一:
<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>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"/>