chrome中的css border-radius错误(百分比)



嗨,我在chrome中遇到问题。我认为这可能是一个错误,但我找不到太多信息。基本上我想在图像上应用边界半径。边界半径为50%,形成一个圆圈。我之所以把它设置为%,是因为我不清楚图像的宽度/高度。

你知道为什么chrome不能正确显示边框吗?我还没有在FF<4.但FF4与IE一样适用于更改

你想做什么?是否要在图像后面显示一个圆圈?这就是我在FF中看到的。在Chrome中,圆圈是在裁剪图像的边缘。

根据规范——http://www.w3.org/TR/css3-background/#corner-clipping——内容应该被截断。

替换元素的内容为始终修剪到内容边缘曲线

对我来说,这意味着Chrome在这方面遵循了规范。

Webkit当前没有剪辑图像的角点。从图像中移除src标记,您将看到边界被正确地圆角。

一种解决方法是可以在css中设置background-image属性:http://jsfiddle.net/tEzwJ/

我找到了一种绕过它的方法,将边界和边界半径添加到父对象上。然后我也将边界半径应用于图像。虽然有一个微小的差距,它现在在铬工作。我还没有在FF3.6中测试过。但是FF4显示相同的结果

最新更新