使用他们能让代码语义化更直观,而且更方便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. 使用jQuery发送ajax

    我们先看一下js的原生ajax 直接进入代码,我们先准备好servlet,之后不会改动,所以先看一下. package cn.curry.servlet; import com.alibaba.fas ...

  2. 一键部署Drupal开源内容管理系统

    https://market.azure.cn/Vhd/Show?vhdId=10897&version=12950 产品详情 产品介绍Drupal是一个由Dries Buytaert创立的自 ...

  3. mysql-新增、更新、删除语句

    1.插入数据: INSERT INTO t_book VALUES(NULL,'我爱我家',20,'张三',1); INSERT INTO t_book(id,bookName,price,autho ...

  4. python基础教程总结2——字符串

    1.基本操作 序列操作:索引,分片,乘法,判断成员资格,长度,最值...... 注:字符串不可变,分片赋值不合法 2.字符串格式化 模板 格式化字符串时,Python使用一个字符串作为模板.模板中有格 ...

  5. codeforces Gym 100286H Hell on the Markets

    紫书上面的题,队友做的,WA了freopen..爆了int... UVA 1614 - Hell on the Markets 奇怪的股市(贪心,结论)

  6. Ball Coloring

    6552: Ball Coloring 时间限制: 1 Sec  内存限制: 128 MB提交: 13  解决: 7[提交][状态][讨论版][命题人:admin] 题目描述 There are N ...

  7. 《毛毛虫团队》第九次团队作业:BETA冲刺与团队项目验收

    一:实验名称:Beta冲刺与验收准备 二:实验目的与要求 (1)掌握软件黑盒测试技术: (2)学会编制软件项目总结PPT.项目验收报告: (3)掌握软件项目验收内容,验收流程. 三.实验内容与步骤 任 ...

  8. 解决AjaxFileUpload中文化/国际化的问题。

    由微软官方提供的AjaxControlToolKit,在ASP.NET开发过程中,确实能够给开发者带来很多的便利,节约开发者的重复劳动.这套控件也是比较成熟的,在性能方面也不会太差,至少能够满足一般开 ...

  9. Bootstrap 缩略图

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  10. 使用HTML5语义标签时要注意的问题

    header,nav,section,article,aside,figue,figcaption,footer以上这些标签(除figcaption标签外)都是块级标签,为了让这些标签及元素在所有的浏 ...