我想知道如何在IE8及以下版本的浏览器中应用border-radius。
我知道border-radius是HTML5的功能,而IE8不支持它。
我发现通过使用.htc文件可以实现,但使用htc时我遇到了黑色背景的问题。
我无法解决这个问题。
是否有其他方法可以在IE8中应用border-radius?如果有,能否有人解释一下如何操作?
我想知道如何在IE8及以下版本的浏览器中应用border-radius。
我知道border-radius是HTML5的功能,而IE8不支持它。
我发现通过使用.htc文件可以实现,但使用htc时我遇到了黑色背景的问题。
我无法解决这个问题。
是否有其他方法可以在IE8中应用border-radius?如果有,能否有人解释一下如何操作?
border-radius
不是 HTML5 的功能,而是 CSS3 的功能。PIE
能够使 Internet Explorer 6-9
能够渲染一些最有用的 CSS3
装饰特性。
................................................................................
因为border-radius是CSS3属性,所以它支持IE9+、Firefox 4+、Chrome、Safari 5+和Opera。您可以使用css3pie。
首先在IE 8中检查此演示,并从此处下载它,然后编写您的CSS规则如下:
#myAwesomeElement {
border: 1px solid #999;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
behavior: url(path/to/pie_files/PIE.htc);
}
behavior: url(path/to/pie_files/PIE.htc);
。在url()中,您需要指定PIE.htc文件的位置。HTML:
<div id="myElement">Rounded Corner Box</div>
CSS:
#myElement {
background: #EEE;
padding: 2em;
-moz-border-radius: 1em;
-webkit-border-radius: 1em;
border-radius: 1em;
behavior: url(PIE.htc);
border: 1px solid red;
}
可以从http://www.css3pie.com下载PIE.htc文件。
如上述答案所述,CSS PIE使得类似于border-radius和box-shadow在IE6-IE8中起作用:http://css3pie.com/
尽管如此,我仍然发现使用PIE时有些不稳定,在使用旧版浏览器的人们无法看到圆角和阴影效果。