web-dev-qa-db-ja.com

SECTION要素を使用する場合

新しいHTML5要素<section>に少し混乱しています。それを使用する正しい方法は何ですか?
この概要を検討してください。

<article>
  <header>
    <h2>Title</h2>
    <p>Spiffy tagline</p>
  </header>
  <section>
    <p>My content! BLA BLA BLA YADDA YADDA</p>
    <p>Some more content!</b>
  </section>
</article>

理にかなっていますか?
タイトルと短いテキストだけの小さな記事がある場合はどうなりますか? sectionを省略することは(意味的に、仕様に関してなど)でしょうか?

8
Agos

セクションが必要ない(小さな記事がある)場合は、コンテンツの周りに裸の<article>エンティティを使用できます。そうしないと、セクションはサブタイトルと段落をそれらのセクションでラップできます。

html5セクションの仕様 を確認してください。

例:

<header>
  <h1>Blog Posts</h1>
</header>
<article>
  <header>
    <h1>Article Header</h1>
    <h2>My Awesome Stuff!</h2>
  </header>
  <p>My content! BLA BLA BLA YADDA YADDA</p>
  <p>Some more content!</b>
</article>
<article>
  <header>
    <h1>Article 2 Header</h1>
    <h2>More of My Awesome Stuff!</h2>
  </header>
  <section>
    <header>
      <h1>Getting started</h1>
    </header>
    <p>Getting started text</p>
  </section>
  <section>
    <header>
      <h1>Now you're underway</h1>
    </header>
    <p>Underway text</p>
  </section>
  <section>
    <header>
      <h1>Wrapping up</h1>
    </header>
    <p>Wrapping up text</p>
  </section>
</article>
2
JasonBirch

Dive Into HTML5 、進行中の本、素晴らしいリソースが見つかると思います。 新しいセマンティック要素をいつ、どのように使用するか の関連セクションです。あなたの例では、<section>タグを省略できる可能性があると思います。

4
Virtuosi Media