在图像悬停放大过渡过程中如何保留图像圆角？

Question

演示

图像放大悬停是很容易的。

图像的圆形边界是容易的。

结合它们，好的，但是圆角在过渡过程中消失了。

过渡之后，圆角又回来了。

问题：如何在过渡期间保留圆角？

.img-wrapper {
    border-radius: 10px;
}

.img-wrapper img {
    transition: transform .5s ease;
    transform:scale(1);
}

.img-wrapper img:hover {
    transform:scale(1.5);
}

Answer 1

尝试添加以下内容：

.img-wrapper {
    border-radius: 10px;
    position:relative;
    z-index:1;
}

如果仍然不工作，尝试从这个问题：溢出:使用边界半径和CSS转换隐藏忽略(仅限于webkit)