让IE6/7/8支持HTML5标签的方法

让IE(ie6/ie7/ie8)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的 document.createElement声明,利用条件注释针对IE来调用这个js文件。Opera,FireFox等其他非IE浏览器就会忽视这 段代码,也不会存在http请求。

方式一:引用google的html5.js文件,代码内容可以自己下载下来看。

 代码如下 复制代码

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

将以上代码放到head标签区间

方式二:自己coding JS搞定。

 代码如下 复制代码

<script>
(function() {
if (!
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;//www.111cn.net
while (i--){
document.createElement(e[i])
}
})()
</script>

不管你用上面哪中方式,请记得在CSS中进行如下定义,目的是让这些标签成为块状元素,just like div。

 代码如下 复制代码

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

既然是写给IE的,所以我修改了头部条件注释里的内容

 代码如下 复制代码

<!--[if lt IE 9]>
<script src="html5.js"></script>
<style>
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
</style>
<![endif]-->

这样,ie就可以正常的显示html5标签写出来的东西了,比如

 代码如下 复制代码

<nav>
<a href="">Home</a>
<a href="">Previous</a>
<a href="">Next</a>
</nav>

时间: 2024-09-20 00:27:09

让IE6/7/8支持HTML5标签的方法的相关文章

让IE浏览器支持HTML5标准的方法

 自HTML5标准的提出就得到非常多的关注,而作为全球使用用户最多的IE浏览器能够支持HTML5标准也是大家备受关注一个问题,上周微软在技术大会上就表示目前微软正在开发的IE9将更加支持HTML5标准,但对于IE9是否将完全支持HTML5所有的标准,微软却表现的有点含糊其辞.HTML5标准能为网页带来更高效更洁净的代码,只有微软参与HTML5的设计工作,才能让IE浏览器识别更多的新元素.   HTML5标准预计是在2022年向全世界发布,虽然目前距他发布的日期还有3年左右的时间,但是我认为它距离

转一篇非常好的IE兼容文章-兼容IE6\7\8浏览器的html5标签的几个方案

html5大行其道的时代已经到来.如果你还在等待浏览器兼容,说明你已经与web脱节几条街了.当然,这得益于移动客户端的蓬勃发展.如果还在纠结于,是否应该掌握html5和css3技术时,请狠狠的抽自己几个嘴巴,然后,苦学吧!因为前端的春天已经到来,而且不止一个春天.如果你不信,我只能说:爱信不信! 下面我们来看一个标准的html5标签结构:(我这里只是说标签,其它概不涉及) <!DOCTYPE HTML> <html> <head> <meta charset=&q

在IE6/7/8下识别html5标签(让老式浏览器识别html5)

识别html5标签: html5添加了许多语义化的标签,比 如<nav></nav>,<aside></aside>,<article>< /article>什么的,当时看到这些标签的时候心想html5估计很多老式IE浏览器都不支持,也没多大重视,今天早上在群里面看到这些标签的 讨论,心里顿时冒出一个疑惑,我在chrome等现代浏览器下面用这些标签固然可以,那么我在IE6/7/8下用这些标签会有什么效果了呢.于是立马动手 测试.  

js检测浏览器是否支持html5中的video标签的方法

 这篇文章主要介绍了使用js检测浏览器是否支持html5中的video标签的方法,需要的朋友可以参考下 代码如下: //检测是否支持HTML5 function checkVideo() {     if (!!document.createElement('video').canPlayType) {         var vidTest = document.createElement("video");         oggTest = vidTest.canPlayType

使用js检测浏览器是否支持html5中的video标签的方法_javascript技巧

复制代码 代码如下: //检测是否支持HTML5function checkVideo() {    if (!!document.createElement('video').canPlayType) {        var vidTest = document.createElement("video");        oggTest = vidTest.canPlayType('video/ogg; codecs="theora, vorbis"');  

为Expression Web 4 添加HTML5 标签支持

大家都知道Expression Web 4 是用来编写网页脚本的一款软件,包含的语言类型涉及:HTML.ASP.PHP.CSS,但它并不支持HTML5.如下图所示,在HTML5 中的<canvas> 标签并不能获得智能感应,这样在开发过程中会变得很麻烦.本篇将介绍如何为其添加HTML5 标签支持.首先需要下载HTML5 模板插件,将得到一个名叫"HTML5Schema.xadd" 的文件. 安装HTML 5 Schema 在"Tools"菜单中选择&qu

一起谈.NET技术,为Expression Web 4 添加HTML5 标签支持

大家都知道Expression Web 4 是用来编写网页脚本的一款软件,包含的语言类型涉及:HTML.ASP.PHP.CSS,但它并不支持HTML5.如下图所示,在HTML5 中的<canvas> 标签并不能获得智能感应,这样在开发过程中会变得很麻烦.本篇将介绍如何为其添加HTML5 标签支持.首先需要下载HTML5 模板插件,将得到一个名叫"HTML5Schema.xadd" 的文件. 安装HTML 5 Schema 在"Tools"菜单中选择&qu

Firefox6正式版试用 完整支持HTML5规则

原计划于本周二(8月16日)发布的Firefox 6.0正式版,提前两日便被它的粉丝们发现在Firefox的FTP服务器上已悄然出现了6.0正式版的丽影,欣喜的用户现在就已然可以下载到这一经典的浏览器来使用了. 相对于上个版本的Firefox5.0,经过两个多月的开发更新环节,Firefox 6.0正式版在很多方面进行了升级更新,笔者在这里将带大家一起来及早地来体验这款更新产品的各个亮点. Firefox 6.0正式版 功能更新的亮点包括 一.对HTML5规范的支持也更为完整 完整地支持HTML

HTML5标签与HTML4标签的区别示例介绍

(1)概念的变化: HTML5专注内容与结构,而不专注的表现 <header> <hgroup>导航相关数据</hgroup> </header> <nav>菜单</nav> <article> <h1>标题:HTML5专题视频教程</h1> (2)声明与标签: HTML5在更多的声明和标签上面做了简化,也对兼容做了详细的规定,废除了部分元素,增加了部分元素. HTML5标签语法介绍及新增标记 1.