没估计错的话旧版浏览器都是不识别这些新增的标签所以都是用行内元素来处理解决的,所以,有一个解决办法的突破口就是让它变成块状元素就不会处于同一行了,这样在新旧浏览器都是可以显示同样的效果,再者就是让浏览器识别标签,需要新增标签,具体解决办法是:
IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,代码如下:
document.createElement(‘新标签’); / /新增创建新标签

方式一:Coding JavaScript

将上代码复制到head部分,记住一定要是head部分(因为IE必须在元素解析前知道这个元素,所以这个js文件不能在其他位置调用,否则失效)

<!--[if lt IE 9]>
<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]-->

方式二:使用Google的html5shiv包(推荐)

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

当然,你也可以把代码拿出来自己看着办:

(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(','),i=e.length;
while(i--){document.createElement(e[i])
}})()
最后在css里面加上这段:
/*html5*/ article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
主要是让这些html5标签成块状,像div那样。

好了,简单吧,一句话概括就是:引用html5.js  使html5标签成块状.

--------------------------------

参考雷锋网的源代码实例:

<!--[if lte IE 8]>
<script>
(function(){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]-->

<参考:http://blog.csdn.net/ptyzhu/article/details/19477695 & http://www.th7.cn/web/html-css/201404/29228.shtml>

让ie浏览器支持html5新标签的解决方法(使用html5shiv)的更多相关文章

  1. 如何让旧浏览器支持HTML5新标签

    HTML5出现也不短了,很多网站的页面都进行了改版,为了降低代码量(不需要起太多的类名),提升加载速度,提高标签的语义性,因此,在网页中大量使用了section,article,header等HTML ...

  2. 支持HTML5新标签

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

  3. 让IE6,7,8支持HTML5新标签的方法

    很多网站对网页进行重构的时候,提高标签的语义性,在网页中大量使用了section,article,header等HTML5新标签.考虑到目前win7自带的IE浏览器版本是IE8,而IE8不支持HTML ...

  4. 让旧浏览器支持HTML5新增标签

    首先我们使用JS进行标签创建,为HTML文件创建我们需要的这几个HTML5标签. 接下来,我们需要使用CSS进行这几个HTML5标签的样式控制,这是因为,通过这种方法创建的新标签,默认是行内元素.   ...

  5. ie8以下不兼容h5新标签的解决方法

    HTML5新添了一些语义化标签,他们能让代码语义化更直观易懂,有利于SEO优化.但是此HTML5新标签在IE6/IE7/IE8上并不能识别,需要进行JavaScript处理. 解决思路就是用js创建h ...

  6. 怎样让老浏览器兼容html5新标签

    CSS样式设置默认样式: <style> article, aside, canvas, details, figcaption, figure, footer, header, hgro ...

  7. 让低版本浏览器支持html5的标签

    原理就是首先用js的createElement来创建,之后在使用 document.createElement('header'); <header> <hgroup>头部信息 ...

  8. html5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5?

    * HTML5 现在已经不是 SGML(标准通用标记语言,是一种定义电子文档结构和描述其内容的国际标准语言) 的子集,主要是关于图像,位置,存储,多任务等功能的增加.   * 拖拽释放(Drag an ...

  9. HTML5有哪些新特性,移除了哪些元素?如何处理HTML5新标签的浏览器兼容性问题?如何区分HTML和HTML5?

    HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加. 绘画canvas: 用于媒介回放的video和audio元素: 本地离线存储localStorage长期存储数据 ...

随机推荐

  1. 深入解析direct path read (转)

    文章转自:http://www.itpub.net/thread-1815281-1-1.html 传统读取数据的方式是服务器进程通过读取磁盘,然后把数据加载到共享内存中,这样后面的进程就可以通过共享 ...

  2. Qt出现cannot find -IGL错误

    Solution: sudo apt-get install build-essential sudo apt-get install libgl1-mesa-dev

  3. Handlers

    示例: - name: Configure webserver with nginx and tls hosts: webservers sudo: True vars: conf_file: /et ...

  4. Spring Cache 介绍

    Spring Cache 缓存是实际工作中非常常用的一种提高性能的方法, 我们会在许多场景下来使用缓存. 本文通过一个简单的例子进行展开,通过对比我们原来的自定义缓存和 spring 的基于注释的 c ...

  5. Alpha版本十天冲刺——Day 3

    站立式会议 会议总结 队员 今天完成 遇到的问题 明天要做 感想 鲍亮 Android端登录验证接口 子线程无法返回从服务器获取的信息. 注册接口.忘记密码接口 开发经验不足,有一个问题不知道怎么解决 ...

  6. SaltStack项目实战(六)

    SaltStack项目实战 系统架构图 一.初始化 1.salt环境配置,定义基础环境.生产环境(base.prod) vim /etc/salt/master 修改file_roots file_r ...

  7. springMVC的注解@RequestParam与@PathVariable的区别

    1.在SpringMVC后台控制层获取参数的方式主要有两种, 一种是request.getParameter("name"),另外一种是用注解@RequestParam直接获取. ...

  8. 网摘 窗体的旋转效果 wpf

    <Window x:Class="simplewpf.chuantixx" Name="DW1"         xmlns="http://s ...

  9. Linux防火墙:iptables禁IP与解封IP常用命令

    在Linux服务器被攻击的时候,有的时候会有几个主力IP.如果能拒绝掉这几个IP的攻击的话,会大大减轻服务器的压力,说不定服务器就能恢复正常了. 在Linux下封停IP,有封杀网段和封杀单个IP两种形 ...

  10. mysql_query()与mysql_real_query()

    mysql_query() cannot be used ” character, which mysql_query() interprets as the end of the statement ...