边界半径Safari

时间:2013-05-08 08:47:50

标签: css image safari border css3

我正在制作横幅,供人们上传图片。

在上传之前,您会看到图像。只需一个标准的HTML代码

<div id="box"><img src="blah blah" /></div>

CSS

div {
    width:370px;
    height:204px;
    position:relative;
    overflow:hidden;
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

图像将适合div id =“box”成功。如果你能看到我使用border-top-left-radius和right-radius:这在firefox和Chrome中都很完美。但是在野生动物园里它不起作用。

示例
这是 Chrome Firefox 。你可以看到图像适合屏幕,顶部有一个漂亮的边框半径 enter image description here

这是 Safari 。您会看到图像顶部没有边框半径。我不知道这个问题。
enter image description here

为此我也尝试使用:

-webkit-

但那也没有用。有人知道如何解决这个问题吗?

2 个答案:

答案 0 :(得分:0)

请在下面更新css并检查.....并根据您的requirmnet进行必要的更改..

希望这能解决您的问题

div {
    width:370px;
    height:204px;
    position:relative;
    overflow:hidden;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #D9D9D9;
}

如果您的问题已解决,请标记答案...

答案 1 :(得分:0)

这就是你所需要的:

div {
width:370px;
height:204px;
position:relative;
overflow:hidden;
border-radius: 7px 7px 0 0;
}

保持简单。 : - )