利用CSS设置图像的对比度
contrast()函数
contrast()
函数设置的是元素的对比度,对比度对视觉效果的影响非常关键,理论上来说,对比度越高,图像在轮廓上显示越清晰,对比度越低,轮廓越模糊。其参数设置也是100%为原图对比度,高于则高,低于则低
代码示例:
<style type="text/css" media="all">
.dark {
filter: contrast(50%);
}
.bright {
filter: contrast(150%);
}
</style>
<body>
<img src="https://yunshew.com/images/2022/12/03/IXdf.jpg" alt="1" />
<img src="https://yunshew.com/images/2022/12/03/IXdf.jpg" alt="2" class="dark"/>
<img src="https://yunshew.com/images/2022/12/03/IXdf.jpg" alt="" class="bright"/>
</body>
效果演示
原图效果
对比度50%
对比度150%
你也来试试吧!
提示:
每次预览后,需要再次点击编辑代码才会回到代码界面进行修改或者复制
利用CSS设置图像的对比度
https://xsunhua.cn/701.html



共有 0 条评论