HTML5网页布局

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<header>
	<div class="container">
		...logo
		<nav>
			...导航
		</nav>
	</div>
</header>
<section class="banner">
	...
</section>
<section class="main">
	<aside>
		...
	</aside>
	<article>
		...
	</article>
</section>
<footer>
	<div class="container">
		...
	</div>
</footer>
</body>
</html>

写好文章后可以通过CSSComb插件美化css样式，参考《CSSComb插件的安装和参数配置以及消除空行》

【补充】：

如果有部分浏览器不能兼容html5的新增标签，则可以直接在css文件开头添加：

header,
nav,
section,
aside,
article,
footer{
    display:block;
}