很多低版本的浏览器是不识html5新增的标签的，所以为了解决浏览器兼容性问题，主要有两种方法：
- js可以创建我们自定义的标签，例如，我们可以用js语句 document.createElement('leo')创建<leo>标签，然后再给它样式，但是创建的leo标签并不是一个块标签，所有可以利用display:block;使leo标签成为块标签，所以我们可以利用js语句分别将html5新增的标签（header,footer...）创建出来，然后分别设置他们的display:block;这样，就可以兼容低版本的浏览器。
- 利用一个插件 html5shiv.js ，这也是跟第一种方法差不多，只不过第一种比较麻烦，现在将第一种方法写成js插件引入，比较方便。
新增的带有功能效果作用性的标签（datalist、datadetails）要想兼容，只能用原始的js来实现
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script src="js/html5shiv.js"></script>
<style>
body{
margin:0px;
padding:0px;
}
header{
/*display: block;*/
height:100px;
background: #9f3;
}
article{
/*display: block;*/
position: relative;
padding:10px;
background: #cf6;
overflow: hidden;
zoom:1;
}
aside{
/*display: block;*/
position: absolute;
left: 10px;
top:10px;
width:200px;
height: 300px;
background: #f06;
}
section{
/*display: block;*/
margin-left: 210px;
height: 300px;
background: #f90;
}
footer{
/*display: block;*/
height: 100px;
background: #c60;
}
</style>
<script src="js/html5shiv.js"></script>
<script>
/*兼容低版本浏览器：
(1) 利用js创建这些标签，然后再将所有的标签都display:block;
（2）利用插件html5shiv.js
*/
// document.createElement('header');
// document.createElement('article');
// document.createElement('aside');
// document.createElement('section');
// document.createElement('footer');
</script>
</head> <body>
<header>用在页面的头部或者板块的头部</header>
<article>
<aside>侧边栏</aside>
<section>内容区域</section>
</article>
<footer>页面底部</footer> </body>
</html>