了解H5

以上是H5布局标签

其中：

1.Header区
　　Header区的例子包含了页面标题和副标题。除了网页本身之外，标签还可以包含关于和的公开信息。

<header>
    <hgroup>
          <h1>我是大标题</h1>
          <h2>我是小标题 </h2>
    </hgroup>
    <p> hell0 hello</p>
</header>

包含公开信息的例子

<header> 
<h3>学习H5布局</h3> 
<p> hello worl</p> 
<p> Logo</p> 
</header> 

2.Navigation区
　　< nav>元素定义了一个专门用于导航的区域，< nav>标签应该用做主站点的导航，而不是用来放置被包含在页面的其他区域中的链接。

<nav>
<ul>
<li>Home</li>
<li>about</li>
<li>help</li>
</ul>
</nav>

3.Article和Section区
　　你设计的页面包含了一个Article区，该区域存放了页面的实际内容。该标签定义的内容可独立于页面中的其他内容使用。标签标识了可被删除、可被放置在另一上下文中。
　　Acme United规划中的Article区包含了三个Section区，<section>包含了web内容的相关组件区域<section>标签和<article>标签通常以一个<header>为开始并以一个< footer>结束，标签的内容则放在这两者之间。<section>标签也可以包含< article>标签。<section>标签应该用来分组相类似的信息。

<section>
<article>
<h1>web技术的发展</h1>
</article>
<article>
<h1>HTML5的发展状况</h1>
</article>
<article>
<h1>移动设备页面布局</h1>
</article>
</section>
<article>
     <section>  Content1  </section>
     <section>  Content 2 </section>
</article> 

4.图像元素figure和figcaption
　　< section>和< article>标签这两者，以及< header>和< footer>标签都可以包含< figure>标签，你使用该标签来加入图像、图表和照片。
　　< figure>标签可以包含< figcaption>，该标签相应的包含了包含在< figure>标签中的图形的标题，其允许你输入描述，把图形和内容更加紧密的关联起来。

5.视频和音频标签
< audio>标签标识了声音内容。< audio>属性分别有：src、preload、control、loop和autoplay。
<video>标签允许你播放视频片段或是流化视觉媒体。它拥有< audio>标签所有的属性，另外再加上三个：poster、width和height。当视频正在加载或是视频处于完全没有加载的糟糕情况中时，poster属性可让你找出一张图像来应付着先。

6.<source>标签
<video>和<audio>标签可以包含< source>标签，该标签定义了< video>和< audio>标签的多媒体资源。

7.< embed>标签
< embed>标签定义了可带入到页面中的嵌入式内容——例如， 一个Adobe Flash SWF文件的插件。

除了src和type属性之外，< embed>标签还拥有height和width属性。

8.Aside区
　　这一标签被看作是用来存放补充内容的地方，这些内容不是其所补充的一篇连续文章的组成部分。< aside>标签包含的内容可被删除，而这不会影响到包含了该内容的文章、章节或是页面所要传达的信息。

<p>去年，我和我家人一起去了凤凰古城玩</p>
<aside>
     <h4>我妹妹在长沙</h4>
     <p>其他人都在家里，我们打算在县城汇合</p>
</aside>

9.Footer区
　　< footer>元素包含了与页面、文章或是部分内容有关的信息，比如说文章的作者或是日期。作为页面的页脚，其有可能包含了版权或是其他重要的法律信息。

<footer>
     <p>Copyright 2011 Acme United. All rights reserved.</p>
</footer>

来源：http://bbs.zzfriend.com/thread-1905-1-1.html