記事全体の範囲を示す

07/27/2018

HTML入門

記事全体の範囲を示す要素

/*記事全体の範囲を示す記述*/
<article>ここに記事の内容が入る</article>

article要素は、雑誌や新聞の記事、ブログの記事のような、その範囲内に内容全体が入っているセクションを表します。

メモ

article要素に対して、全体の一部分となっているセクションを表す場合はsection要素を使います。このsection要素と比べると違いが良く分ってくると思います。

記事全体の範囲を示した例

article要素を使って記事全体の範囲を示した例です。article要素の間に記事の内容が入っていることが分かります。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>記事全体の範囲を示した例</title>
</head>
<body>
<article>
<h1>異常な暑さの日本</h1>
<p>夏が暑いのは当たり前だが、今年の夏はちょっと様子が違う。異常なほどの暑さで、クーラーなしでは身の危険すら感じる。</p>
<p>どこかの記事にあったが、夏の気温が一昔前と比べて約5℃ほど高くなっているらしい。熱中症指数も「危険」という言葉が出ており、部屋の中が安全とは限らない。</p>
<p>・・・中略・・・</p>
<p>一年を通してみても、日本には四季があるはずだが、現在では四季よりも二季くらいの方が適切かもしれない。地球温暖化の対策については色々と議論されているが、いよいよ真剣に取り組む必要があるのではないだろうか。</p>
</article>
</body>
</html>

記事全体の範囲を示すarticle要素を記述した文書をブラウザで表示させた例です。

article要素を使った例
メモ

article要素を使っているかどうかは、ブラウザの表示だけでは分かりません。HTML文書を記述するときの話で、文書構造をはっきりさせるための要素だと考えれば良いでしょう。

Posted by kiri