HTML5新标签在IE6/IE7/IE8中的几种兼容方式
- coding javascript
代码块
<script>
(function(){
If(!0)
Return;
var e = “abbr, article, aside, audio, canvas, datalist, dialog, eventsource, figure, footer, header, hgroup, menu, meter, nav, output, progress, section, time, video,”.split(‘, ’)
var i= e.length;
while (i--){
document.createElement(e[i])
}
})()
</script>
<![endif]-->如果是IE9z以下的IE浏览器将创建HTML5标签，这样非IE浏览器就会忽视这段代码，也就不会有无谓的http请求了。
- 使用Google或百度的html5shiv包（推荐）
代码块
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
**********************************************************************
<!--[if lt IE 9]>
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
<![endif]-->（推荐国内用户使用，因为Google在国内不稳定）但是不管使用哪种方法，首先都要初始化新标签的CSS。因为HTML5默认情况下表现为内联元素，我们需手动将其转为块状元素方便布局
Article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block;}
但是如果IE6/IE7/IE8禁用脚本呢？我们可以参照Facebook的做法，引导用户进入带有noscript标识的”/?_fb_noscript=1”页面，用HTML4标签替换HTML5标签，这要比为了保持兼容性而写大量hack的做法更轻便一些。
<noscript>
<style>.html5-wrappers{display:none!important;}</style>
<div class="ie-noscript-warning">您的浏览器禁用了脚本，请<a href="">查看这里</a>来启用脚本!或者<a href="/?noscript=1">继续访问</a>.
</div>
</noscript>
<![endif]-->
- 嵌套标签
在语义化的HTML5标签内嵌套div等可用标签，然后只给div写样式。
代码块
<style>
body > * .section {
color: red;
}
</style>
<![endif]-->
<style>
section .section { color: red;
}
</style>
<section><div class="section">内容</div></section>- IE条件注释
<!--[if lt IE 9]><div class="section"><![endif]-->
<!--[if IE 9]><section class="section"><![endif]-->
<!--[if !IE]><!--><section class="section"><!--<![endif]-->
......
<!--[if lt IE 9]></div><![endif]-->
<!--[if IE 9]></section><![endif]-->
<!--[if !IE]><!--></section><!--<![endif]-->- 使用xmlns定义文档命名空间
原有命名空间：
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">HTML5以后被简化的命名空间：
<html lang="en">
扫一扫
3354
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
