我正在制作横幅,供人们上传图片。
在上传之前,您会看到图像。只需一个标准的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 。你可以看到图像适合屏幕,顶部有一个漂亮的边框半径
这是 Safari 。您会看到图像顶部没有边框半径。我不知道这个问题。
为此我也尝试使用:
-webkit-
但那也没有用。有人知道如何解决这个问题吗?
答案 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;
}
保持简单。 : - )