在IE中支持“边界半径”

158

有谁知道Internet Explorer是否/何时支持“ border-radius” CSS属性？

internet-explorer css

— 小马托尼
source

220

是! IE9于2011年1月发布时。

假设您要在所有四个侧面上平均15像素：

.myclass {
 border-style: solid;
 border-width: 2px;
 -moz-border-radius: 15px;
 -webkit-border-radius: 15px;
 border-radius: 15px;
}

IE9将使用默认值border-radius，因此只需确保在所有样式中都将其包括在内就称为边框半径。然后，您的站点将可以使用IE9。

-moz-border-radius适用于Firefox，-webkit-border-radius适用于Safari和Chrome。

此外：不要忘了声明您的IE编码为ie9：

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

一些懒惰的开发人员<meta http-equiv="X-UA-Compatible" content="IE=7" />。如果该标记存在，则border-radius在IE中将永远无法使用。

— 凯文·佛罗里达
source

7

想必如果您不使用X-UA-Compatible元标记，就不需要添加它就可以使其在IE9中工作吗？

— 同行

72

您应该放置供应商前缀版本FIRST和标准LAST，以便如果浏览器支持实际的标准，则它将使用该标准而不是供应商前缀版本。

— 杰森·贝里

4

正确，您不需要meta标签。如果包含ie7仿真器，则只需替换它即可。否则，不用担心。

— 凯文·佛罗里达

3

当前IE9 beta“边界半径”中的FYI使用单个值即可正常运行。除非您实际上希望它们不同，否则不需要所有四个值。

— mikemaccana 2010年

2

@nailer：感谢您更新角落。.IE9的第一个alpha vs和beta vs要求声明所有4个角落。我刚刚下载了最新的IE9 RC，它是让我声明一个值..不改变的时候..肯定

— 凯文·佛罗里达

46

自一年前提出以来，这个问题的答案已经改变。（此问题目前是谷歌搜索“边界半径即”的最佳结果之一。）

IE9将支持border-radius。

有一个平台预览版提供哪些支持 border-radius。您将需要Windows Vista或Windows 7来运行预览（以及发布时的IE9）。

— 戴维·约翰斯通
source

27

等待时.. 弯角（边界半径）跨浏览器

— 路易斯·梅拉加蒂
source

18

解决方法和方便的工具：

CSS3Pie使用.htc文件和behavior属性将CSS3实施到IE 6-8。

Modernizr是一些javascript，它将在您的html元素上放置类，从而使您可以根据其功能为不同的浏览器提供不同的样式定义。

显然，这些都增加了更多的开销，但是由于IE9仅在Vista / 7上运行，因此我们可能会停留很长时间。截至2010年8月，Windows XP仍占Web客户端操作系统的48％。

— 彼得·G
source

2

到目前为止，CSS3 PIE是最简单，侵入性最小的选项。

— 克里斯·拉斯科

12

IE8没有计划。请参阅CSS兼容性页面。

除此之外，还没有发布任何计划。有传言称IE8将是 Windows XP 的最新版本

— 本
source

12

您显然错了，因为IE9也应该支持CSS3，而且我看不到IE会死于任何地方。有人请杀死IE

— Starx 2010年

10

事实证明IE8是Windows XP的最新版本。

— M. Dudley

7

<!DOCTYPE html> 没有此标记的border-radius在IE9中不起作用，不需要元标记。

— 江淮汽车
source

6

快速更新此问题，IE9将根据以下内容支持边界半径：http : //blogs.msdn.com/ie/archive/2009/11/18/an-early-look-at-ie9-for-developers.aspx

— 西蒙琼斯
source

4

Use -ms-border-radius: 15px，任何使用css -ms-的元素都与IE兼容。

— 伊亚格·布鲁诺（Iago Bruno）
source

2

IE的角半径问题将解决。

http://kbala.com/ie-9-supports-corner-radius/

— 贾亚
source

2

如何支持边界半径和背景渐变。是的，IE9分别支持它们，但是如果将两者混合使用，则渐变圆角处会流血。以下是一个不良示例的链接，但我也在自己的测试中也看到了。应该进行屏幕截图:(

也许真正的问题是IE何时将在没有MS-FILTER专有黑客的情况下支持CSS标准。

http://frugalcoder.us/post/2010/09/15/ie9-corner-plus-gradient-fail.aspx

— SigmaBetaTooth
source

IE10将支持适当的CSS3渐变（当前IE10开发人员预览版已通过-ms-linear-gradient支持）。如果您希望渐变遵循 IE9中的边界半径，则需要使用SVG（外部SVG文件或以数据URI编码的文件）-请参阅css3wizardry.com/2010/10/29/css-gradients-for- ie9 -CSS3 PIE也将很快实现这一自动化，有一个可用

— lojjic 2011年

一种快速的解决方法是将其包装在另一个元素中。给父元素相同的边框半径，并将其溢出设置为隐藏。

— Senne

1

解决-在IE 10和11中无法正确渲染边框半径

对于那些没有使-ms-border-radius：或border-radius：在IE 10,11中工作的用户，它将呈现所有正方形，然后执行以下步骤：

单击IE浏览器右上方的齿轮
单击兼容性视图设置
现在取消选中默认情况下选中的2个框。

确保未选中照片中的框

— 艾伦·斯塔尔
source