有些浏览器并不支持HTML5中的新增元素，如IE8或更早版本。想要应用样式，可以头部标记<head>中加入下面JavaScript代码
 <html>

 <head>

 <meta charset=uft-8"/>

 <style>

 header{

     color: red;

     width: 500px;

 }

 </style>

 <script>document.createElement("header")</script>

 </head>

 <body>

 <header>Hello world!</header>

 </body>

 </html>

对重点就是document.createElement。考虑各个浏览器兼容性不同，可以对上面JS代码进行优化，即使用条件语句包含JS代码

IE9以下版本的IE将创建HTML5标签， 非IE浏览器会忽略这段代码，因此不会发生http请求，也就不影响网页执行效率。

 <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里面加上这段：

/*html5*/ article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
主要是让这些html5标签成块状，像div那样。

另外还有种能让IE识别那些新元素的途径就是使用HTML5 shiv，html5shiv的使用非常的简单，在你的网页中引入Google的html5shiv包（已经写好的直接可调用）在页面head中即可

 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>

一定要加在<head></head>里调用 (因为浏览器必须先解释了这个脚本才能解析后面的html5标签，所以不能放在页面底部）

下载地址: http://html5shiv.googlecode.com/svn/trunk/html5.js

浏览器不支持HTML5的更多相关文章

  1. 新Chrome浏览器不支持html5的问题

    window.applicationCache事件,最新chrome浏览器已经不能判断是否支持html5: 之前,在IE和Google中 为ApplicationCache对象,而在FF中为 Offl ...

  2. 判断浏览器是否支持HTML5 video

    话不多说,下面是我从W3C扒的判断浏览器是是否支持H5视频的代码,有需要的小伙伴,拿走不谢 HTML <div id="checkVideoResult"><bu ...

  3. ie8下面版本号（包含ie8）的浏览器不支持html5标签属性解决方式（Modernizr 2.6.2插件的使用）

    我这边申明下:我写这篇日志主要是想然ie8可以支持html5的个别标签闭合,并不能让ie全然支持html5.我之前写的可能会误导非常多同学.希望大家能明确. 今天脑抽想用html5标签设计一个网页.我 ...

  4. 解决浏览器不支持HTML5和CSS3

    Modernizr插件可用于解决:<响应式web设计>提及! 其他: 第一种方法:IE9以下版本的IE将创建HTML5标签, 非IE浏览器会忽略这段代码,因此不会发生http请求,也就不影 ...

  5. 让所有的浏览器都支持html5

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

  6. 判断浏览器是否支持html5和css3属性

    本文章内容是由一个前辈写的. CSS3特有的属性moz-Transform //判断是否具有相应属性 testProps: function (props) { var i; for (i in pr ...

  7. 添加shiv让所有现代浏览器都支持 HTML5 语义元素 html5.js让IE（包括IE6）支持HTML5元素方法

    引用Google的html5.js文件 <!--[if IE]> <script src=”http://html5shiv.googlecode.com/svn/trunk/htm ...

  8. JS检测浏览器是否支持HTML5视频播放 (标签<video>) ,

    function checkVideo() { if (!!document.createElement('video').canPlayType) { var vidTest = document. ...

  9. 判断当前浏览器是否支持HTML5的日期控件

    function checkSupportH5Date(){ var i = document.createElement("input"); i.setAttribute(&qu ...

随机推荐

  1. [原]My first Python

    我的第一个Python程序: print 'hello world' raw_input ("print any key to continue...") 在python3.4下应 ...

  2. 搭建高性能计算环境（五）、应用软件的安装之Amber12

    应用软件通常安装在/opt目录下,这样系统中的各个用户都能方便使用,下面的软件都将安装到/opt目录. 1,上传需要的软件包Amber12.tar.gz.AmberTools13.tar.bz2.Am ...

  3. Show Users Assigned to a Specific Role

    In a previous post I showed you how to know what Roles are assigned to a specific user. But here is ...

  4. Java TCP异步数据接收

    之前一直采用.Net编写服务端程序,最近需要切换到Linux平台下,于是尝试采用Java编写数据服务器.TCP异步连接在C#中很容易实现,网上也有很多可供参考的代码.但Java异步TCP的参考资料较少 ...

  5. BM串匹配算法

    串匹配算法最常用的情形是从一篇文档中查找指定文本.需要查找的文本叫做模式串,需要从中查找模式串的串暂且叫做查找串吧. BM算法好后缀规则 公式: 对于长度为m的模式串P,在i处失配时,模式串向前滑动的 ...

  6. iOS中使用子线程的完整方法

    http://www.cnblogs.com/ygm900/archive/2013/06/23/3151691.html 第一步:开启子线程 //开启子线程到网络上获取数据 myFirstThrea ...

  7. Android Socket通信

    1.TCP: xml: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns: ...

  8. Android开发环境下关于如何导出手机通讯录数据库【Written By KillerLegend】

    首先度Linux中的权限(Permissions)进行一些说明: permissions一共有10个符号位,[- --- --- ---],在这里我们从左至右由0开始编号,各个符号位的编号分别为0,1 ...

  9. Bootstrap 2.3.2学习

    1.下载架包,下载编译好的文件,文件目录结构如下所示: bootstrap/ ├── css/ │ ├── bootstrap.css │ ├── bootstrap.min.css ├── js/ ...

  10. MongoDB 学习笔记（二）—— MongoDB Shell

    MongoDB自带一个JavaScript shell 可以从命令行中与MongoDB交互,功能非常强大.如在上一节最后一张图所看到,可以执行JavaScript程序. 运行Shell 前提是启动Mo ...