HTML5基础教程:header元素的使用实例

2012-02-20 15:36:20  来源:网页教学网 

网页制作Webjx文章简介:header元素是一种具有引导和导航作用的结构元素,通常用来防止整个页面或页面内的一个内容区块的标题,但也可以包含其它内容,例如数据表格、搜索表单或相关的logo图片。

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

在整个页面中的标题一般放在页面的开头,一个网页中没有限制header元素的个数,可以拥有多个,可以为每个内容区块加一个header元素。

多个header元素示例:

<header>
  <h1>网页标题</h1>
</header>
<article>
  <header>
    <h1>文章标题</h1>
  </header>
  <p>文章正文</p>
</article>

在HTML5中,一个header元素通常包括至少一个headering元素(h1-h6),也可以包括hgroup元素,nav元素,还可以包括其它元素(tableform)。

博客网页中的header元素示例

<header>
  <hgroup>
    <h1>网页标题</h1>
    <p>网页描述…</p>
  </hgroup>
  <nav>
    <ul>
      <li>…</li>
      <li>…</li>
    </ul>
  </nav>
</header>
更多