利用HTML5+CSS3创建一个简单的web页面，页面规划如下图：

最终页面效果：

页面的设计包含了一个Header区、一个Navigation区、一个包含了三个Section区和一个Aside区的Article区，以及最后的一个Footer区。

Header区

Header区的例子包含了页面标题和副标题，< header>标签被用来创建页面的Header区的内容。

< header>标签的例子

< header>
< h1>标题文字< /h1>
< p> 文本或是图像可放在这里< /p>
< p> Logo通常也放在这个地方< /p>
< /header>

使用< nav>标签来创建页面的Navigation区。

< nav>元素定义了一个专门用于导航的区域，< nav>标签应该用做主站点的导航，而不是用来放置被包含在页面的其他区域中的链接。Navigation区可以包含诸如清单3所示的代码。

< nav>标签的例子

< nav>
< ul>
< li>< a href="#" kesrc="#">Home< /a>< /li>
< li>< a href="#" kesrc="#">About Us< a>< /li>
< li>< a href="#" kesrc="#">Our Products< /a>< /li>
< li>< a href="#" kesrc="#">Contact Us< /a>< /li>
< /ul>
< /nav>

Article和Section区
Article区，该区域存放了页面的实际内容。Article区包含了三个Section区，可使用< setction>标签来创建这几个区域。
 < article>标签和< section>标签的例子

< article>
< section>
Content
< /section>
< section>
Content
< /section>
< /article>
< section>
< article>
Content
< /article>
< article>
Content
< /article>
< /section>