html - 为什么 CSS3 边框半径不适用于 webkit 浏览器(Chrome 和 Safari)上的图像？

Question

这适用于 firefox 4 和 ie9，但不适用于 chrome 或 safari。它在歌剧中也不起作用，但谁在乎呢。那么如何让它发挥作用呢？

img { width: 100px; height: 100px; border: 3px solid #fff; 

-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
border-radius: 10px; 

}

Answer 1

解决方法是使用 div 并将 div 的背景设置为图像。

.rounded { 
    width: 100px;
    height: 100px; 
    border: 3px solid #fff; 

    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    border-radius: 10px; 

    background: url(image.png) no-repeat;
}