让浏览器识别HTML5规范中的新标签
IE8浏览器中还没有添加对HTML5新标签的支持,所以在IE8中无法直接展现HTML5新标签中的内容。庆幸的是IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,代码如下:
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])}浏览器支持新标签后,还需要添加标签默认的样式:
article,aside,figcaption,figure,footer,header,hgroup,nav,section{display:block}mark{background:#FF0;color:#000}这样两段简单的JavaScript代码和CSS代码就可以让IE8及以下版本浏览器支持HTML5中的新标签。当然最好的方式是直接使用成熟的框架,目前有多个基于这一思想的框架,使用最多的是html5shim框架,html5shim的使用方法很简单,在页面的head部分添加框架的引用即可:
<!--[if lt IE 9]><script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script><![endif]-->让浏览器识别HTML5规范中的新标签的更多相关文章
- 认识HTML5中的新标签与新属性
前端之HTML5,CSS3(一) HTML5中常用内容标签 header标签 header标签定义文档的页眉,基本语法:<header>content</header>. na ...
- HTML5 按字母顺序排列的标签列表 new : HTML5 中的新标签。
标签 描述 <!--...--> 定义注释. <!DOCTYPE> 定义文档类型. <a> 定义超链接. <abbr> 定义缩写. <acron ...
- New : HTML5 中的新标签
基础 标签 描述 <!DOCTYPE> 定义文档类型. <html> 定义 HTML 文档. <title> 定义文档的标题. <body> 定义文档 ...
- html5中的新标签
header <header> 标签定义文档的页眉(介绍信息). nva 根据W3C的定义规范:nav元素是一个可以用来作为页面导航的链接组: <nav><ul>& ...
- 在HTML5规范中div中读取预存的data-[key]值
HTML 代码: <div id="div_test" data-test="this is test" ></div> jQuery ...
- 关于html5的几个新标签在IE9之前不支持的解决办法
IE8及之前的浏览器不支持用CSS的方法来使用这些尚未支持的结构元素,为了在Internet Explorer浏览器中也能正常使用这些结构元素,需要使用JavaScript脚本,如下:<scri ...
- 【HTML5】如何处理HTML5新标签的浏览器兼容版问题
HTML5规范毕竟是刚刚才定义完成的规范,还有一些浏览器并不能支持其中的新标签和新属性,尤其是IE8及以下版本浏览器.以下介绍一些在页面中使用HTML5新标签的实践方法,目的是让HTML5中的新标签在 ...
- 如何让低版本的IE浏览器(IE6/IE7/IE8)支持HTML5 header等新标签
html5提供的一些新标签(article,aside,dialog,footer,header,section,footer,nav,figure,menu)使用起来非常的方便,但是低版本的IE浏览 ...
- html5中的video标签和audio标签
不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的vid ...
随机推荐
- centos7无法上网问题
在虚拟机VM中安装了centos7,无法上网,在同一个虚拟机里,也安装了Ubuntu是可以上网的,不知道咋回事,所以上网查了资料博客,现总结如下. 一.首先打开虚拟的设置,可以看到虚拟机网络的设置默认 ...
- YYYY-mm-dd HH:MM:SS 时间格式
YYYY-mm-dd HH:MM:SS部分解释 d 月中的某一天.一位数的日期没有前导零. dd 月中的某一天.一位数的日期有一个前导零. ...
- (转)python中math模块常用的方法整理
原文:https://www.cnblogs.com/renpingsheng/p/7171950.html#ceil ceil:取大于等于x的最小的整数值,如果x是一个整数,则返回x copysig ...
- [转]ASP.NET MVC 4 最佳实践宝典
原文:http://www.cnblogs.com/sonykings/archive/2013/05/30/3107531.html ASP.NET MVC最佳实践 本文档提供了一套旨在帮助创建最佳 ...
- CentOS6.5下Ambari安装搭建部署大数据集群(图文分五大步详解)(博主强烈推荐)
第一步: Ambari安装之Ambari安装前准备(CentOS6.5)(一) 第二步: Ambari安装之部署本地库(镜像服务器)(二) 第三步: Ambari安装之安装并配置Ambari-serv ...
- C/C++ -- Gui编程 -- Qt库的使用 -- HelloWorld
1.纯代码写对话框HelloWorld 创建空Qt工程,添加C++源文件main.cpp 需要设置编码以支持中文 -----源代码main.cpp----- #include <QApplica ...
- Docker挂载主机目录Docker访问出现Permission denied的解决办法
Docker挂载主机目录,访问相应的文件出现Premission denied的权限访问问题, [root@localhost soft]# docker images REPOSITORY ...
- Java并发编程-核心问题(1)
一.常见问题 从小的方面讲, 并发编程最常见的问题就是可见性.原子性和有序性问题. 从大的方面讲, 并发编程最常见的问题就是安全性问题.活跃性问题和性能问题. 下面主要从微观上分析问题. 二.可见性问 ...
- 【ASP.NET Core】处理异常--转
老周写的[ASP.NET Core]处理异常非常的通俗易懂,拿来记录下. 转自老周:http://www.cnblogs.com/tcjiaan/p/8461408.html 今天咱们聊聊有关异常处理 ...
- layer相关使用
父子页面传参数 转自:https://blog.csdn.net/babyxue/article/details/76854106 1.父页面打开子页面并向子页面传参数 function setCho ...