css怎么设置图片的对比度(2)-木庄网络博客

2022-03-24 13:07:38 PHP中文网 JavaScript 百度已收录

<!DOCTYPE HTML>
<html>
    <head>
    <meta charset="UTF-8">
    <style type="text/css">
        img{
            width: 200px;
        }
        .img1{
            /*没有滤镜效果*/
             
            /*考虑浏览器兼容性：兼容 Chrome, Safari, Opera */
            -webkit-filter: none; 
            filter: none;
        }
        .img2{
            /*调整元素的对比度*/
             
            /*考虑浏览器兼容性：兼容Chrome,Safari,Opera*/
            -webkit-filter: contrast(30);
            filter: contrast(30);
        }
    </style>
    </head>
    <body>
        <div class="demo">
            <img src="1.jpg" class="img1"/>
            <img src="1.jpg" class="img2"/>
        </div>
    </body>
</html>