CSS提供的濾鏡也是一大亮點，我一直癡迷其中，有些濾鏡的效果很有用，可是有些的濾鏡效果可能只是為了玩玩兒，CSS常見的濾鏡有這些：grayscale, blur, sepia，所有常見的過濾器。但是如何使用和轉化圖片呢？今天我們主要是來講講如何使用CSS3濾鏡讓圖片反轉顏色。

CSS代碼

invert濾鏡就是為了設置元素的反色效果，他的值設置范圍為：0-100%，100%為完全反色，0為顯示正常的顏色。

.normal {
 filter: invert(0%);
}

.inverted {
 filter: invert(100%);
}

你可以反轉單個元素的顏色，或你也可以反轉document.documentelement整個網頁內容，得到反轉以后的效果。 將原來的CSS值，所以沒有辦法獲得真實的反演值給定的屬性的。

彩色反轉是一個有用的輔助工具，但它是由用戶的操作系統或一個單獨的工具通常提供。我可以看到被幫助的反演的晚上，緩解眼睛疲勞時，看著屏幕。你能想出一個好用的彩色反轉？請分享！

本文系作者 問說網 授權問說網發表，并經問說網編輯，轉載請注明出處和 本文鏈接。
本站文章除注明轉載外，均為本站原創或翻譯，歡迎任何形式的轉載，但請務必注明出處，尊重他人勞動。
轉載請注明：文章轉載自：問說網 » 使用CSS3濾鏡讓圖片反轉顏色
本文標題：使用CSS3濾鏡讓圖片反轉顏色
本文地址：https://www.uedsc.com/invert-colors-css.html

總結

以上是生活随笔為你收集整理的使用CSS3滤镜让图片反转颜色的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。