圆角内图片放大会使圆角消失的解决方案

    xiaoxiao2021-03-25  152

    在做一个轮播框的时候需要用到鼠标移入图片放大,并且还要有边框圆角的需求

    一开始直接给父级overflow:hidden和圆角,子级图片transition:0.7s 。 hover后scale(1.05)。但是发现放大时圆角会消失,放大结束后圆角才会回来。

    解决方法是给父级加上transform:rotate(0deg)。原因不知,算是一个偏方了。示例代码如下。

    .pic_content .img3{ width: 95px; height: 79px; position: absolute; overflow: hidden; top: 88px; left: 130px; transform: rotate(0deg); border-radius: 0px 0px 5px 0px; } .pic_content .img3 img{ width: 123px; height: 79px; transition: 0.7s; } .pic_content .img3 img:hover{ transform:scale(1.05) }

    转载请注明原文地址: https://ju.6miu.com/read-3478.html

    最新回复(0)