0

我有一个网站,它在 IE 10 中作为浏览器模式和 IE5 怪癖作为文档模式完美运行。但是圆角在这种情况下不起作用。当我将文档模式更改为 IE 9 标准时,圆角正在工作。但我希望 IE 5 怪癖作为文档模式。

我的 CSS 是:

.roundedcorner
{
    behavior: url(/Includes/border-radius.htc);
    -moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    -khtml-border-radius: 30px;
    border-radius: 30px;
    border-top-left-radius:30px;
    border-top-right-radius:30px;
    border-bottom-left-radius:30px;
    border-bottom-right-radius:30px;
}
4

3 回答 3

4

Quirks 模式不支持 CSS3,并且 CSS 行为在 IE10 中被禁用。您可以将标题设置为IE=edge并忘记 Quirks 模式。

<meta http-equiv="X-UA-Compatible" content="IE=edge">

查看http://border-radius.com/

-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
于 2013-08-26T10:58:55.197 回答
0

尝试这个

<!--[if gte IE 9]>
    <style>
        .roundedcorner{
            border-top-right-radius: 20px; 
            border-bottom-right-radius: 20px; 
            border-top-left-radius: 20px;
            border-bottom-left-radius: 20px;
        }
    </style>
<![endif]-->

或者

<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<style>
.roundedcorner{
border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
}
</style>

喜欢

演示

于 2013-08-26T10:58:52.840 回答
0

将浏览器模式IE9IE9 standards. 这里的代码工作正常。此外,当它们都是 时,无需将每个角定义为单独的属性30px,因此只需使用border-radius: 30px;.

于 2013-08-26T10:59:27.990 回答