jquery - 边框半径不适用于 chrome 中的相对定位图像

Question

我有一个具有以下样式的 div：

overflow:hidden;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;

里面有一个图像，但高度与另一个 div 的高度相对应，包含文本。

如果 div 包含的文本不足，则图像在第一个 div 内向上移动。因为它已经隐藏了溢出，所以你不会看到这个。所有这一切都很好，直到我想给第一个 div 一个边界半径，它只是没有显示出来。这只发生在 chrome、firefox 和 IE 中它确实有效。

score 0 · Accepted Answer

我不确切知道您想要达到什么效果，但这是一个通过将图像设置为背景图像在 Chrome（和其他）中工作的示例。

还有一个将半径应用于图像：

此外，该border-radius属性在所有支持它的浏览器中都“无前缀”，因此您只需要：

    border-radius: 20px;

score 0 · Accepted Answer

这是 div 内图像的边界半径，我不完全理解您的问题，所以修改我制作的这个 JSFiddle 以向我展示它的实际含义。

2 回答 2