css如何设置图片的对比度

　　介绍

这篇文章给大家分享的是有关css如何设置图片的对比度的内容。小编觉得挺实用的,因此分享给大家做个参考。一起跟随小编过来看看吧。

css设置图片的对比度的方法:可以利用【过滤器:对比(%)】属性来设置图片的对比度,如【过滤器:对比(0%)】.filter属性定义了元素的可视效果,如模糊,饱和,对比度等。

属性介绍:

过滤器属性定义了元素(通常是& lt; img>)的可视效果(例如:模糊与饱和度)。

语法:

过滤器:没有|模糊()()()| |亮度对比|下拉阴影()|灰度()| hue-rotate() |反转()|不透明度()|饱和()|乌贼()| url ();

对比(%),,调整图像的对比度。值是0%的话,图像会全黑,值是100%,图像不变。值可以超过100%,意味着会运用更低的对比。若没有设置值,默认是1 .

举例:

& lt; !DOCTYPE HTML> 　　& lt; html> 　　& lt; head> 　　& lt;元charset=癠TF-8"祝辞 　　& lt;风格类型=拔谋?css"比; 　　img { 　　宽度:200 px; 　　} 　　.img1 {/*没有滤镜效果*//*考虑浏览器兼容性:兼容Chrome, Safari、Opera */-webkit-filter:没有; 　　过滤器:没有; 　　} 　　.img2 {/*调整元素的对比度*//*考虑浏览器兼容性:兼容Chrome, Safari、Opera */-webkit-filter:对比(30); 　　过滤器:对比(30); 　　} 　　& lt;/style> 　　& lt;/head> 　　& lt; body> 　　& lt; div类=癲emo"祝辞 　　& lt; img src=https://www.yisu.com/zixun/?. jpg”class=" img1 "/>