IE9以下浏览器对CSS3的常用兼容处理

html-css014

IE9以下浏览器对CSS3的常用兼容处理,第1张

html5shiv:解决ie9以下浏览器对html5新增标签的不识别,并导致CSS不起作用的问题。

respond.min:让不支持css3 Media Query的浏览器包括IE6-IE8等其他浏览器支持查询。

官方网站: http://css3pie.com/

演示地址: http://css3pie.com/demos/gradient-patterns/

1.兼容border-radius

2.阴影效果

3.部分 CSS3 的效果,如 多张背景图,border-image,背景颜色渐变效果

4.png 图片透明效果

我们首先来了解一下,目前支持html5和css3的浏览器有哪些。

浏览器版本 支持情况

IE9全面支持

IE10 全面支持

Firefox 4.0全面支持

Safari 5.0 全面支持

Safari 6.0 全面支持

Chrome5.0 部分支持

Chrome6.0 部分支持

Chrome7.0 部分支持

Chrome8.0 部分支持

Chrome9.0 部分支持

Chrome10.0 全面支持

遨游3.0全面支持

那么究竟哪款浏览器支持html5和css3比较好呢?有人将这几款浏览器作了一次详细的测试,从测试结果来看,Chrome、IE10表现更为出色。

IE10技压群芳,IE10无疑对html5的支持更好些。所以在浏览器的选择上,考虑到使用体验的话,IE10绝对是最佳选择。

参考资料

让所有IE都支持html5的解决方法

html5.js必须在页面head元素内调用(因为IE必须在元素解析前知道这个元素,所以这个js文件不能在页面底部调用。)

作者已经把js文件放在Google code project上并允许大家直接调用,当然,前提是你不在意调用额外的文件。

你可以使用IE条件注释来调用这个js文件,这样像FireFox等非IE浏览器就会忽视这段代码,也就不会有无谓的http请求了。下面这段代码仅会在IE浏览器下运行:

<!--[if IE]>

<script src="htt p:/ /html5shiv.googlecod e.c om/svn/tru nk/h tml5.js"></script>

<![endif]-->

当然如果你不喜欢调用外网文件,你也可以下载下来上传到自己的服务器单独调用(作者允许)。