带有多个标头标签的html5结构

时间:2014-06-17 22:17:36

标签: html html5 semantic-markup

这种结构在语义上是否正确?我在想这个结构在语义上是否正确。

<html>
  <head></head>
  <body>
    <header></header>
    <section>
      <header>
        <h1></h1>
      </header>
    </section>
    <section>
      <header>
        <h1></h1>
      </header>
    </section>
  </body>
</html>

1 个答案:

答案 0 :(得分:1)

它严重依赖于实际内容。

例如,具有此结构的文档可以代表一本书。 第一个header可以包括有关该书的元信息,如姓名,作者,目录等。 每个section都可以代表一个章节。 header中的section可以包含有关章节的元信息,如姓名,奉献等。

<!doctype html>

<html>
  <head>
    <meta charset="utf-8">
    <title>My Awesome Book</title>
  </head>
  <body>
    <header>
      <h1>My Awesome Book</h1>
      <nav>
        <h1>Table of Contents</h1>
        <ul>
          <li>
            <a href="#chapter1">Chapter 1</a>
          </li>
          <li>
            <a href="#chapter2">Chapter 2</a>
          </li>
        </ul>
      </nav>
    </header>
    <section id="chapter1">
      <header>
        <h1>Chapter 1</h1>
        <p>This chapter is dedicated to voices in my head. Thank you for inspiration.</p>
      </header>
      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi, velit!</p>
    </section>
    <section id="chapter2">
      <h1>Chapter 2</h1>
      <p>Asperiores corporis illum minus vel tempora non voluptate dolores itaque nam?</p>
    </section>
  </body>
</html>