Section と Article
CoddyのHTMLジャーニー「基礎」セクションの一部。レッスン 28/60。
HTMLでは、<section>タグと<article>タグを使って、コンテンツを論理的な部分に整理します。
<section>タグは、章や、通常は独自の見出しを持つ、あるトピックに関する文書内の別の部分など、文書内のセクションを定義します。関連するコンテンツをまとめるために使います。たとえば、<section>を使って、ページを導入、コンテンツ、連絡先情報に分けることができます。
<section>タグの使い方は次のとおりです。
<section>
<h2>Section Heading</h2>
<p>Section content goes here.</p>
</section><article>タグは、独立した自己完結型のコンテンツを指定します。それ自体で意味が通じ、ウェブサイトのほかの部分とは独立して読める必要があります。<article>要素を使用できる例として、フォーラムの投稿、ブログ記事、ニュース記事、コメントなどがあります。
<article>タグの使い方は次のとおりです。
<article>
<h2>Article Title</h2>
<p>Article content goes here.</p>
</article>チャレンジ
簡単ウェブページを構成するために、<section>タグと<article>タグを使用するHTMLドキュメントを作成してください。以下のセクションを含めてください。
- ページのメインコンテンツを格納する
<main>セクション。 <main>の中に、「Upcoming Events」という見出し(<h2>)を持つ<section>を作成します。<section>の中に、2つの<article>要素を作成します。- 各
<article>には、見出し(<h3>)と、ダミーテキストを含む段落(<p>)を入れます。見出しには"Event 1"と"Event 2"を、段落には"Event 1 details..."と"Event 2 details..."を使用してください。
自分で試してみよう
<!DOCTYPE html>
<html>
<body>
<!-- ここにコードを書いてください -->
</body>
</html>このレッスンには短いクイズがあります。レッスンを始めて解答し、進捗を記録しましょう。
基礎のすべてのレッスン
自分で練習してみよう: Webプレイグラウンド