Question

我用Google搜索了但无法找到解决方案。我正在将角半径应用于我的div，但是IE9没有显示效果。

CSS：

.ipleft {
width: 512px;
height:300px;
-webkit-border-radius: 10px 0px 0px 10px;
-khtml-border-radius: 10px 0px 0px 10px;
-moz-border-radius: 10px 0px 0px 10px;
border-radius: 10px 0px 0px 10px;
background-image: url(images/ipleft.png);
float: left;}

.ipright {
width: 512px;
position: relative;
height:300px;
-webkit-border-radius: 0px 10px 10px 0px;
-khtml-border-radius: 0px 10px 10px 0px;
-moz-border-radius: 0px 10px 10px 0px;
border-radius: 0px 10px 10px 0px;
background-image: url(images/ipright.png);
float: right;}

我添加了相应的元标记，但它仍无效！该网站是www.campusonsale.com。如果你看一下FF，应用圆角没有问题，但IE9显示矩形角！

Answer 1

您的网站以怪癖模式显示。这是因为您在<script>之前有一些内容（<!doctype>元素）。在怪癖模式下，IE使用类似于IE5的渲染，因此border-radius不起作用。

Answer 2

我可能需要添加此元标记：<meta http-equiv="X-UA-Compatible" content="IE=edge" />

这将告诉IE使用可用的最新渲染引擎，这意味着应该渲染border-radius。这当然只适用于IE9及更高版本。

Answer 3

IE切换到页面上的怪癖模式，这就是角落不起作用的原因。我认为这是因为doctype之前的脚本标记，但你应该使用验证器来消除所有可能的原因。

Answer 4

我会尝试这个。它对我有用：

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

没有使用＆＃34; border-radius＆＃34;在IE9中

4 个答案: