使用CSS3濾鏡讓圖片反轉顏色

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