圆角在IE9中不起作用

时间:2011-08-10 19:07:57

标签: html css css3

我有一个圆角对话框,可以在Firefox中正常工作,但IE9中没有圆角。

我使用以下代码:

            #dialog-box {
/* css3 drop shadow */
-webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
/* css3 border radius */
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
background:#eee;
width: 1000px;
height:900px;
/* make sure it has the highest z-index */
position:absolute;
z-index:5000;
/* hide it by default */
display:none;
}

3 个答案:

答案 0 :(得分:7)

除了webkit和mozilla扩展,您还需要使用“标准化”border-radius属性:

border-radius: 5px;

http://msdn.microsoft.com/library/ff974085.aspx

W3:http://www.w3.org/TR/css3-background/#the-border-radius

答案 1 :(得分:2)

请同时添加

box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
border-radius: 5px;

-moz-border-radius - Firefox

-webkit-border-radius - Safari 3,4

border-radius - Opera 10.5,IE 9,Chrome,Safari 5

答案 2 :(得分:1)

正确的规则是border-radius: 5px;