CSS | invert()函数

invert()函数是一个内置函数，用于对图像应用滤镜以设置样本图像颜色的反转。

句法：

invert( amount )

参数：此函数接受保存转换量的单个参数量。 invert 的值是根据值和百分比设置的。值 0% 表示原始图像，100% 表示反转图像。

invert()函数在内部使用以下公式来计算图像的倒数：

amount * (255 - value) + (1 - amount) * value

反转值由变量amount控制，变量值介于0 – 1 (浮动)范围内(这是通过将传递的颜色反转百分比转换为 0-1 之间的值来完成的)。该值是像素的颜色值。 (255-value)给出颜色值减去最大像素值后的颜色，假设像素值在0 – 255范围内(尽管可以拉伸/缩放输入图像样本空间以满足指定标准) .

下面是一个包含反演百分比列表及其产生的结果的表格。

Inversion	Result
0%	Original Image
50%	Image with each pixel having grey color
100%	Completely inverted Image

下面的示例说明了CSS 中的 CSS invert()函数：
例子：

 
 
  
 
     
      
    
 
  
 
    
GeeksforGeeks
 
      
    
CSS invert() function
      
     
 
  

输出：

支持的浏览器： invert()函数支持的浏览器如下：

• 谷歌浏览器
• IE浏览器
• 火狐
• 苹果浏览器
• 歌剧