Question

在new site边框半径上似乎无法正常工作。

我可以看到边框弯曲，但背景却没有。

Answer 1

border-radius应该有效。

以下是IE 9中的作品

如果不支持IE7 / IE8中的border-radius，则不应包含CSS3PIE，因为IE9包含border-radius css属性的支持。

修改

我更新了你的小提琴

http://jsfiddle.net/Zr8vE/3/

并改变了以下内容：

#main-menu li.first{ border-left:1px solid #feb800; border-top-left-radius: 5px 5px; -moz-border-top-left-radius: 5px 5px; -webkit-border-top-left-radius: 5px 5px; border-bottom-left-radius: 5px 5px; -moz-border-bottom-left-radius: 5px 5px; -webkit-border-bottom-left-radius: 5px 5px; padding-left:10px; }

编辑：＃2

我从（#main-menu li）
中删除了以下内容
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe9900', endColorstr='#ff7c00',GradientType=0 );
它开始工作了。（我在IE 9中尝试过，橙色背景似乎弯曲类似于边框）

http://jsfiddle.net/Zr8vE/15/

Answer 2

我认为这是您需要的解决方案。

你的css中的

将此应用于需要圆角的元素

#element{
behavior: url(border-radius.htc);
}

下载并在Google border-radius.htc 中搜索并将其保存在您的图片文件夹中，或者您喜欢的任何地方都是带曲线的图片，用于解决IE问题。

我会发布我的主要菜单，我的主菜单适用于我的圆形边框。

#main-nav {
width: 100%;
background: #ccc;
margin: 0;
padding: 0;
position: absolute;
left: 0;
bottom: 0;
z-index: 100;
/* gradient */
background: #6a6a6a url(images/nav-bar-bg.png) repeat-x;
background: -webkit-gradient(linear, left top, left bottom, from(#b9b9b9), to(#6a6a6a));
background: -moz-linear-gradient(top,  #b9b9b9,  #6a6a6a);
background: linear-gradient(-90deg, #b9b9b9, #6a6a6a);
/* rounded corner */
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
/* box shadow */
-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
box-shadow: inset 0 1px 0 rgba(255,255,255,.3), 0 1px 1px rgba(0,0,0,.4);
}

请试一试。

这是链接http://jsfiddle.net/vZaJX/

希望它有所帮助。

Answer 3

实际上，它不仅是IE9，还有IE9 - 。

您可以关注@Bert答案，也可以尝试CSS3PIE

用法是一样的，但CSS3PIE为IE提供了更多的CSS3功能。

Answer 4

现在是答案。

尝试只编辑单词的间距。

http://jsfiddle.net/ApYw4/

对于IE 9解决方案，我告诉过你下载此 border-radius.htc 并添加到您的css中

#main-menu{
behavior: url(border-radius.htc);
//all css
}

如果有任何错误，请不要犹豫纠正我。

border-radius适用于所有浏览器，IE9除外

4 个答案: