2016-09-18 6 views
2

私は<article><section>の使い方について多くを読みました。私は<article>の部分を取得すると思います。しかし、<section>にはまだ混乱があります。私はHTML5doctorでthis postを読んだことがありますが、まだ質問があります。HTML5 <section>タグの説明

簡単な例を考えてみましょう。ゲームをプレイできるウェブページがあります。上部に「ダッシュボード」、「その他のゲーム」、「バージョン情報」というナビゲーションメニューがあります。各ページは見出しで始まり、下位レベルの見出しを含みます。

たとえば、「Singleplay」、「Multiplayer」、「Statistics」、「Instructions」、それぞれの下のテキストとそれぞれのHTMLページへのリンクがあります。 html5doctorで

section要素は、一般的な文書またはアプリケーション部

私のような考えることができ、各 "ページ" を推測しているを表しますか? しかし、この場合のサブ見出しもセクションですか?そうではありませんか?。コンテンツを含む新しい見出しがあるたびに、<section>が適切と主張できるように感じます。しかし、それは手を抜くことができる、ない..?

+1

"コンテンツを持つ新しい見出しがあるたびに、

が適して主張することができように感じます" 。それはかなりです。 HTML4では、各h1-h6要素*は暗黙的に*新しいセクションを開始します。
要素は、同じことを行う明示的な方法を提供するだけです。この説明は、セクションが最初のh1〜h6要素の前に開始することを示す場合、またはセクションの終わりを示す場合に便利です。 – Alohci

答えて

1

<section>要素は、関連するコンテンツのグループを表すために使用されます。これは、<article>要素の目的に似ていますが、主な違いは、<section>要素内のコンテンツが必ずしもページのコンテキストから意味をなす必要はないということです。セクションとは、ウェブサイトのセクションの音だけです。私は、最も一般的な使用は、それをIDに割り当てることができると思います。だから話すのは自分の存在です。 <section id="examples">に割り当てることができ、どこからでもウェブサイトのそのセクションに移動することができます。

セクションのトピックを定義するには、見出し要素(<h1> - <h6>)を使用することをお勧めします。

例としてこのブログ記事を使用すると、投稿内の個々の部分のそれぞれを表す<section>要素を持つことができます。

<article> 
 
    <h1>How to use HTML5 Sectioning Elements</h1> 
 
    <p>...</p> 
 

 
    <section> 
 
    <h2>The <main> Element</h2> 
 
    <p>...</p> 
 
    </section> 
 
    <section> 
 
    <h2>The <article> Element</h2> 
 
    <p>...</p> 
 
    </section> 
 
    <section> 
 
    <h2>The <section> Element</h2> 
 
    <p>...</p> 
 
    </section> 
 
    ... 
 
</article>

+0

各見出しにセクションがあることをお勧めしますか?このストレッチはどれくらいですか? "関連コンテンツのグループ"の定義は私にはあまり言いません。どのようなコンテンツですか?見出し?テキスト?見出しの下のテキストは常に関連しているので、見出しは常に

タグで使用する必要があります。 – Mumfi

+0

私たちについて、 お問い合わせ 最新情報、 イベント、 お客様の声、よくある質問、これらはセクションの一部の例です。記事はブログ投稿のようになりますが、私が記述するのが最も簡単です。それはより多くの情報を持っています。 –

-1

ここでは役立つかもしれない例です:

<html> 
    <head>    
    </head> 
    <body> 
     <header> 
     </header> 
     <main> 
      <section id='first'> 
      </section> 
      <section id='second> 
      </section> 
     <main> 
     <footer> 
     </footer> 
    </body> 

+0

文脈がなければ、それは本当に私のためにはあまり効果がありません。私の教授は、私たちに "私たちの製品"、 "私たちのサービス"を表示するページを持っている例を私に与えました。これらはセクションタグ内にあります。 「当社の製品」には、「エレクトロニクス」、「食品」などの小見出しがあります。これらもセクションタグに含まれています。しかし、さらに "ダウン"、彼はそれを使用を停止します。私は理由を知りたい。 – Mumfi