把图片亮度降低之后border-radius就不起作用了的解决办法

css中给图片亮度降低之后,border-radius再给图片添加圆角的话,就不起作用了

如:

<img src="#" />

这个时候,就需要在image标签外面套一层div,在div上面降低暗度,这样圆角就有效果了,

如:

<style>
    .container-img{
        -webkit-filter: brightness(0.5);
        filter: brightness(0.5);
    }
    .container-img img{
        border-radius:10px;
    }
</style>
<div class="container-img">
    <img src="" />
</div>

猜你喜欢

转载自blog.csdn.net/yehuaner33/article/details/83059425