html5shiv - 让IE9以下的IE支持HTML5元素

现在越来越多的人html5,可以说html5已经成为主流,但是ie大部分版本(IE9以下版本)都不支持html5元素。可是在国内还有很多人在使用ie9以下版本。让我们用html5辛辛苦苦布局好的页面在这些IE版本下显得是一塌糊涂。为了让这不同的IE版本之间能"认识"HTML5元素,开源的html5shiv出现了!

html5shiv的最大特点是让那些个不认HTML5的IE浏览器承认HTML5元素,并按照最基本的处理方式处理HTML5元素——块化(display:block)。html5shiv主要解决HTML5提出的新的元素不被IE6-8识别,这些新元素不能作为父节点包裹子元素,并且不能应用CSS样式。

html5shiv的原理是使用createElement方法,这包含document.createElement和document.createDocumentFragment,对当前页面的HTML5元素进行动态的调整,并且为这些元素提供最基本的样式

html5shiv使用方法:

我们只要在html页面head中直接添加

<!--[if lt IE 9]>
<script src="html5shiv.min.js"></script>
<![endif]-->

上边的html5shiv路径你可以远程引用,或者直接下载放到本地来调用。

<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->

Ps:html5shiv.js 引用代码必须放在元素中,因为 IE 浏览器在解析 HTML5 新元素时需要先加载该文件。

html5shiv 百度cdn:http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js

最新的html5shiv版本可以打开http://cdn.code.baidu.com/,然后搜索htmlshiv

html5shiv github:https://github.com/aFarkas/html5shiv/tree/master/dist

另外在css中需要把html5元素块状化(display:block),在你的css中添加如下代码

article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}

Views: 1,295 Tags: ,
飞鱼

发表评论

电子邮件地址不会被公开。 必填项已用*标注