一、语义话标签
header:头部
article: 主体部分
aside:主体的附属信息,一般都是放侧边栏
section:内容区域
footer:页脚
二、功能性标签
address:作者信息
progress:进度条
mark:标记
dialog:定义一段对话
datalist:选项列表
****************************基本HTML页面结构
<script type="text/javascript">
document.createElement('header');
document.createElement('article');
document.createElement('aside');
document.createElement('section');
document.createElement('footer');
</script>
<style>
*{margin:0;padding:0;}
header{100%;height:100px;background:red;display: block;}
article{ 100%;height:500px;background:darkgrey;display: block;}
aside{40%;height:100%;background:darkgoldenrod;float: left;display: block;}
section{60%;height:100%;background:cadetblue;float:right;display: block;}
footer{100%;height:100px;background: yellow;display: block;}
</style>
</head>
<body>
<header>头部</header>
<article>
<aside>侧边栏</aside>
<section>内容部分</section>
</article>
<footer>尾部</footer>
</body>