如何让低版本的IE浏览器(IE6/IE7/IE8)支持HTML5 header等新标签
html5提供的一些新标签(article,aside,dialog,footer,header,section,footer,nav,figure,menu)使用起来非常的方便,但是低版本的IE浏览器(IE6/IE7/IE8)对的这些新标签“视而不见”,根本识别不了,不免让前端工作者们望而却步。
下面我们收集整体了一些方法,让你再也没有后顾之忧了。
一、引用JS库
让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标签区间,由于现在国内基本上直接访问不了谷歌的服务器,如果直接引入外部JS,会让网页打开非常慢,所以建议大家先下载到服务器上,再进行本地文件的引用。
方式二:自己coding JS搞定。
<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>
不管你用上面哪中方式,请记得在CSS中进行如下定义,目的是让这些标签成为块状元素,just like div。
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
如何让低版本的IE浏览器(IE6/IE7/IE8)支持HTML5 header等新标签的更多相关文章
- 让IE6/IE7/IE8支持HTML5标签的js代码
让IE(ie6/ie7/ie8)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE来调用这个j ...
- css中使用if条件在各大浏览器(IE6\IE7\IE8)中hack方法解决教程
一个滚动代码,其他浏览器都滚的好好的,就IE出现错误,DIV+CSS if条件hack,这里DIVCSS5为大家介绍针对各大浏览器(IE6\IE7\IE8)中使用if条件hack方法教程,DIV CS ...
- 各版本IE兼容问题,IE6,IE7,IE8,IE9,IE10,IE11
在网站开发和学习中,由于各种兼容性问题,让开发者挺烦恼的,我的学员也经常因为兼容问题来找我取经. 事实上,IE给出了解决方案,谷歌给出了解决方案,国内著名网站百度也将这个解决方案应用于IE的兼容性问题 ...
- 让IE6/IE7/IE8支持CSS3属性的8种方法介绍
我们都知道,IE浏览器暂不支持CSS3的一些属性.国外的工程师们,不安于此现状,他们总是尽量使用一些手段使IE浏览器也能支持CSS3属性,我觉得这些都是很有意义,很有价值的工作,可以推动整个技术领域的 ...
- IE6 IE7 IE8 的函数声明和函数表达式的实现与其他浏览器有差异
标准参考 函数声明和函数表达式 定义一个函数有两种途径:函数声明和函数表达式. 函数声明: function Identifier ( FormalParameterList opt ) { Func ...
- IE6 IE7 不支持 JSON
最近发现ie6.7不支持json,解决方法:引入json2.js <script type="text/javascript" src="json2.js& ...
- IE6 IE7 IE8(Q) 负边距 (margin) 导致元素溢出 hasLayout 容器时显示异常
标准参考 根据W3C CSS2.1规范第8.3节中的描述,边距属性设置了一个框的边距区的宽度.'margin' 缩写属性设置所有四边的边距,而其它的边距属性( 'margin-top' ,'margi ...
- IE6 IE7 IE8(Q) 不支持 JSON 对象
标准参考 JSON 是一种数据交换格式,RFC 4627 对 JSON 进行了详细描述. 根据 ECMA-262(ECMAScript)第 5 版中描述,JSON 是一个包含了函数 parse 和 s ...
- SJ9012: IE6 IE7 不支持 JSON 对象
标准参考 JSON 是一种数据交换格式,RFC 4627 对 JSON 进行了详细描述. 根据 ECMA-262(ECMAScript)第 5 版中描述,JSON 是一个包含了函数 parse 和 s ...
随机推荐
- java---Unicode-字符转换器
实现一个字符(包括汉字)的简单互相转换: package cn.hncu.gui2; import java.awt.Button; import java.awt.Color; import jav ...
- java IO复习(二)
package com.zyw.file; import java.io.*; /** * Created by zyw on 2016/3/10. */ public class FileTest2 ...
- poj 1679 The Unique MST【次小生成树】
The Unique MST Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 24034 Accepted: 8535 D ...
- 详解C#中System.IO.File类和System.IO.FileInfo类的用法
System.IO.File类和System.IO.FileInfo类主要提供有关文件的各种操作,在使用时需要引用System.IO命名空间.下面通过程序实例来介绍其主要属性和方法. (1) 文件打开 ...
- 跨服务器修改数据 分类: SQL Server 2014-08-21 21:24 316人阅读 评论(0) 收藏
说明: 两个服务器: 192.168.0.22 A 192.168.0.3 B 数据库备份在A上 数据库在B上 在A上写: exec sp_addlinkedserver 'ITSV ...
- html5之canvas困惑 在canvas标签内需要设置了宽跟高,如果在css中设置同样的宽跟高,画出来的图像变形了?
<canvas class="cvs"></canvas> 遇到的问题: 如css 中设.cvs{width:500px;height:400px;},也就 ...
- android的tabhost+RadioGroup+PopupWindow
根据网上的代码稍作修改了下,放着记录学习. 效果图如下: 主代码如下: package com.andyidea.tabdemo; import android.app.TabActivity; im ...
- httpd cgi程序配制+.py .cgi执行
vi /etc/httpd/conf/httpd.conf httpd默认首页配制: DirectoryIndex index.html index.html.var 首页的位置定义: Docume ...
- 还在用ListView?
还在用Lisview?RecyclerView都已经出来一年多了! 想必大家多或多或少的接触过或者了解过RecyclerView,为什么没有用起来,原因大概如下? ListView我用的挺好的,为什么 ...
- git 指令汇总
学习git过程中整理的笔记: git add 添加文件到暂存区: git commit -m "更改说明" 提交文件更改: git status 查看当前文件状态: git dif ...