使用他们能让代码语义化更直观,而且更方便SEO优化。但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理。以下就介绍几种方式。

方式一:Coding JavaScript

<!--[if lt IE9]>
<script>
(function() {
if (!
/*@cc_on!@*/
0) return;
var e = "abbr, article, aside, audio, canvas, datalist, details, dialog, eventsource, figure, footer, header, hgroup, mark, menu, meter, nav, output, progress, section, time, video".split(', ');
var i= e.length;
while (i--){
document.createElement(e[i])
}
})()
</script>
<![endif]-->

如果是IE9以下的IE浏览器将创建HTML5标签, 这样非IE浏览器就会忽视这段代码,也就不会有无谓的http请求了。

第二种方法:使用Google的html5shiv包(推荐)

<!--[if IE]>
<script src="js/html5.js"></script>
<![endif]-->

但是不管使用以上哪种方法,都要初始化新标签的CSS.因为HTML5在默认情况下表现为内联元素,对这些元素进行布局我们需要利用CSS手工把它们转为块状元素方便布局

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

如何让ie8/ie7/ie6支持html5的<footer></footer><nav></nav>等标签的更多相关文章

  1. 区分IE8/IE7/IE6及其他浏览器-CSS “\9″

    区分IE8/IE7/IE6及其他浏览器-CSS “\9″ 原创文章,转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com] by zhangxinxu from h ...

  2. 区分IE8/IE7/IE6及其他浏览器

    在 CSS中常用特殊字符识别表: (1)*:  IE6+IE7都能识别*,而标准浏览器FF+IE8是不能识别*的; (2)!important: 除IE6不能识别 !important外,  FF+I ...

  3. 区分IE9/IE8/IE7/IE6及其他浏览器-CSS hack

    记录一下这些浏览器的hack如下: 一.IE9以及以下版本浏览器 对于IE8及其以下版本的浏览器,就是使用本文标题所提到的”\9″ hack.如下代码: .ie8_9{ color:blue; /*所 ...

  4. jquery 1.9 1.8 判断 浏览器(IE11,IE8,IE7,IE6)版本

    1.9以后很我方法删除了,所有和之前版本判断浏览器版本有所差记录一下 1.9 ------------------------------------------------------------- ...

  5. 让ie浏览器支持html5新标签的解决方法(使用html5shiv)

    没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览 ...

  6. 支持HTML5新标签

    IE8/IE7/IE6支持通过document.createElement方法产生的标签,               可以利用这一特性让这些浏览器支持HTML5新标签,               ...

  7. 不使用JavaScript让IE浏览器支持HTML5元素——张鑫旭

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=2515 如果我们不做什 ...

  8. [HTML5] 让IE支持HTML5的方法

    越来越多的站点开始使用 HTML5 标签,但是目前的情况是还有很多人在使用IE6.IE7.IE8.为了让所有浏览者都可以正常的访问,解决方案有下面两个: 1.为网站创建多套模板,通过程序对User-A ...

  9. 如何让低版本的IE浏览器(IE6/IE7/IE8)支持HTML5 header等新标签

    html5提供的一些新标签(article,aside,dialog,footer,header,section,footer,nav,figure,menu)使用起来非常的方便,但是低版本的IE浏览 ...

随机推荐

  1. put_user

    1. put_user Name put_user --    Write a simple value into user space. Synopsis put_user ( x, ptr); A ...

  2. C语言的time函数和localtime函数

    1.获取当前时间,并获取当前时间(即系统时间)距离1970年1月1日的时间间隔,以秒为单位. 2.获取指定时间距离1970年1月1日的时间间隔,以秒为单位.

  3. Linux下如何修改用户默认目录

      Linux下默认的用户目录一般为/home/xxx(root用户除外),有些时候我们可能需要修改这个目录,下面我就给大家分享2中修改的方法 工具/原料 Linux操作系统 方法/步骤 1 1.切换 ...

  4. jquery.page.js插件在使用时重复触发“上一页”和“下一页”操作

    jquery.page.js使用demo HTML代码 <div class="result"> <div class="tcdPageCode&quo ...

  5. java面试题(杨晓峰)---第八讲谈谈Vector,ArrayList,LinkedList有何区别?

    Vector,ArrayList,LinkedList均为线性的数据结构,但是从现实方式与应用场景中又存在差别. 1 底层实现方式 ArrayList内部数组来实现,LinkedList内部采用双向链 ...

  6. SAP Cloud for Customer客户主数据的地图集成

    点击这个按钮可以通过地图的方式查看C4C客户在地图上的地理位置: 只需要在这个客户的地址栏里维护上天府软件园的经度和维度: 就能够在C4C的客户列表页面里显示该客户在地图上的位置: 要获取更多Jerr ...

  7. 虚拟机VMware Workstation Pro装Mac遇到的一些问题【总结】

    1. 问题:VM找不到Apple Mac X(M)? 解决方法:在网上找unlocker20*下载: 电脑装一个python3版本以下的版本(装python,主要是编译.因为下载的插件是python写 ...

  8. Java设计模式之责任链模式、职责链模式

    本文继续介绍23种设计模式系列之职责链模式.   什么是链 1.链是一系列节点的集合. 2..链的各节点可灵活拆分再重组.   职责链模式 使多个对象都有机会处理请求,从而避免请求的发送者和接受者之间 ...

  9. 获取页面的title值

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. Windows平台下MySQL常用操作与命令

    Windows平台下MySQL常用操作与命令 Windows平台下MySQL常用操作与命令,学习mysql的朋友可以参考下. 1.导出整个数据库 mysqldump -u 用户名 -p --defau ...