html5基础知识

html5新增的主体结构元素

1、section定义文档中的节，例如章节、页眉、页脚或文档其他部分。可以和h1,h2......等元素结合起来使用，显示文档结构。

<section>

<h1>.....</h1>

<h2>......</h2>

</section>

2、article元素定义外部的内容。外部内容可以是来自外部的新闻、来自论坛的文本等其他外部源的内容。

<article>......</article> 

3、article元素的嵌套，内层的内容在原则上需要与外层的内容相关联。例如，一篇博客中，针对评论就可以使用嵌套article元素的方式来表示；用来呈现评论的article元素被包围在整体内容的article元素里面。

4、aside元素一般用来表现网站当前页面或文章的附属信息部分，它可以包含与当前页面或主要内容相关的广告、导航条、引用、侧边栏评论部分，以及其他区别主要内容的部分。

  （1）被包含在article元素中作为主要内容的附属信息部分，其中的内容可以是与当前文章有关的相关资料、名词解释等。

   <article>

  <h1>......</h2>

   <p>.......</p>

   <aside>.......</aside>

    </article>

   (2)在article元素之外使用作为页面或者站点全局的附属信息部分，最经典的是侧边栏，其中的内容可以是友情链接，博客中的其他文章列表、广告单元等。

     <aside>

     <h1>....</h1>

     <ul>

      <li>.....</li>

      <li>.....</li>

    </ul>

     <ul>

      <li>.....</li>

      <li>......</li>

       </ul>

      </aside>

5、nav元素用来将具有导航性质的链接划分在一起，使代码结构在语义化方面更加准确，同时对于屏幕阅读器等设备的支持也更好。

    <nav>

    < a href="..">Home</a>

    < a href="..">Next</a>

     </nav>

一个页面中可以拥有多个<nav>元素，作为页面整体或者部分的导航。

6、time元素，用于定义时间或者日期。该元素可以代表24小时中某个时刻，在表示时刻时，允许有时间差。在设置时间或者日期时，只需要将该元素的属性datetime设为相应的时间或者日期即可。

<p>

<time>........</time>

</p>

<p>

<time datetime=.......>........</time>

</p>

html5新增的非主体结构元素

1、header元素是具有引导和导航作用的结构元素，通常用来放置整个页面或页面内的内容区块的标题，但也可以包含其他内容，例如数据表格、搜索表单或相关的logo图片。

<header>

<h1>......</h1>

</header>

在整个页面中标题一般放在页面的开头，一个页面可以有多个<header>,可以为每个区域加上一个。

2、hgroup元素用于对网页或区段section的标题进行组合。hgroup元素通常会将h1~h6元素进行分组，譬如将一个内容区块的标题及子标题分为一组。

<hgroup>

<h1>......</h1>

<h2>.......</h2>

<hgroup>   通常只有一个主标题是不需要hgroup的。

3、footer元素可以作为其上层父级内容区块或者一个根区块的脚注。footer通常包括其相关区块的脚注信息，如作者、相关阅读链接及版权信息等。

<footer>.....</footer>

4、figure元素是一种元素的组合，可带有标题（可选）。figure元素用来表示网页上一块独立的内容，将其从网页上移除后不会对网页上的其他内容产生影响。figure所表示的内容可以是图片、统计图或者代码示例。

<figure>

<h1>......</h1>

</figure>

使用figure元素时，需要figcaption元素为figure元素组添加标题。不过，figure元素内最多只允许放置一个figcaption元素，其他元素可无限放置。

5、address元素用来在文档中呈现联系信息，包括文档作者或者文档维护者的名字、网站地址等。

<address>

<a href="...">......</a>

</adress>

adress元素不仅可以单独使用，还可以与footer元素、time元素结合起来、