您好,登錄后才能下訂單哦!
這篇“Web網站都變成灰色怎么快速實現”文章的知識點大部分人都不太理解,所以小編給大家總結了以下內容,內容詳細,步驟清晰,具有一定的借鑒價值,希望大家閱讀完這篇文章能有所收獲,下面我們一起來看看這篇“Web網站都變成灰色怎么快速實現”文章吧。
<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"/>
給出一段規范的代碼,把這段代碼加入到網站頁面的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) }
以上就是關于“Web網站都變成灰色怎么快速實現”這篇文章的內容,相信大家都有了一定的了解,希望小編分享的內容對大家有幫助,若想了解更多相關的知識內容,請關注億速云行業資訊頻道。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。