-1

我有这个简单的 DIV,它在 Firefox、Chrome 等中显示良好,但在 IE 中却没有。我有以下html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
  <head>
    <style>
      div.example {
        position:absolute; 
        color:black; 
        text-align:left;
        border:2px solid#000;  
        border-radius:15px; 
        -moz-border-radius:15px; 
      }
    </style>
  </head>
  <body>
    <div class="example" style="height:15em;width:10em;"></div>
  </body>
</html>

在 Firefox 中,我得到一个圆形的 2px 黑色边框。在 IE 中一无所获。从我读过的内容来看,直到 IE9 才支持圆角边框,但我想要 2px 黑色边框,即使它不是圆角的。有没有办法让它在 Firefox、Chrome、IE 和 Safari 中看起来一样?提前致谢 :)

4

1 回答 1

1

您在边框样式中缺少空格。
这是一个工作演示

HTML

<div class="example">&nbsp;</div>

CSS

div.example {
    position: absolute;
    color: black;
    text-align: left;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    border: 2px solid #000;
    width: 10em;
    height: 15em;
}

另外,作为旁注,

border-radius应始终在 之后调用-prefix-border-radius
例如顺序:

...
-moz-border-radius:10px;
-webkit-border-radius:10px;
border-radius:10px;
...
于 2012-12-24T09:18:18.137 回答