ie8支持html5和css3,让IE6/IE7/IE8浏览器支持CSS3属性

一、下载

首先下载ie-css3.htc文件，这个文件是让IE浏览器支持CSS3一些属性的关键东西。

二、关于此文件

.htc是一个脚本文件，只有Internet Explorer(IE)认识这个文件。在其他浏览器中是不能识别的，htc文件可以用来描述web行为，web行为语序程序员把自定义的功能“连接”到现有的元素和控件，而不是必须让用户下载二进制文件(例如ActiveX控件)来完成这个功能。本文这个htc文件，就是让IE支持CSS3的一些属性。

三、如何使用

示例代码：

.box {

-moz-border-radius: 15px; /* Firefox */

-webkit-border-radius: 15px; /* Safari 和 Chrome */

border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */

-moz-box-shadow: 10px 10px 20px #000; /* Firefox */

-webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */

box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */

behavior: url(ie-css3.htc); /* 通知IE浏览器调用脚本作用于'box'类 */

}

可以看到，使用方法相对简单，最后一句添加了behavior这一句，这也是这个方法的优点所在。

四、遇到的一些问题

毕竟不是浏览器自带的属性，使用时遇到问题在所难免，使用此方法存在一定的局限性：

当前元素一定要有定位属性，像是position::relative或是position:absolute属性。

z-index值一定要比周围元素的要高。

五、支持的样式

border-radius：只设置一个角落的圆角属性无效

border-radius： 不支持除了黑色(#000)以外的其他颜色

text-shadow：IE下的表现与Firefox/Safari/Chrome有一点点的差异

六、结语

这里没有找到更好的完全兼容ie的css3属性解决方案，遇到更好的解决方案，后续更新。