MENU
  1. ホーム
  2. HTML
  3. section要素

section要素

HTML
2023.07.20

section要素は、見出しや段落などのコンテンツをグルーピングするための要素になります。
※何回でも使用可能

section要素の説明画像
section要素
記法

<section>章や段落など</section>

<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>section要素について</title>
  </head>
  <body>
    <article class="main_article">
      <section class="content-section">
        <h2>イントロダクション</h2>
        <p>これはイントロダクションセクションです。</p>
      </section>
      <section class="content-section">
        <h2>メインコンテンツ</h2>
        <p>これはメインコンテンツセクションです。</p>
      </section>
      <section class="content-section">
        <h2>結論</h2>
        <p>これは結論セクションです。</p>
      </section>
    </article>
  </body>
</html>
出力結果

イントロダクション

これはイントロダクションセクションです。

メインコンテンツ

これはメインコンテンツセクションです。

結論

これは結論セクションです。

sectionタグはデザインに影響はしないが、共通スタイルをcssで記述する場合が多い

HTML