HTML5

footer

HTML5

footerはセクションのフッターを示すタグです。フッターはセクション毎に利用することができるため、必ずしもページに一つしかないと言うことはありません。

現状のコーディングでは

とは言え、今までの通例もありますので、業界的にはまだhtmlタグのfooter要素として使われることが多いです。

用例

  <article>
    <h1>見出し</h1>
    <p>
      テキスト
    </p>
    <section>
      <header>
        <h2>見出し</h2>
        <p>
          テキスト
        </p>
      </header>
      <h3>見出し</h3>
      <p>
        テキスト
      </p>
      <footer>
        <address >
          連絡先
        </address>
      </footer>
    </section>
    <section>
      <header>
        <h2>見出し</h2>
        <p>
          テキスト
        </p>
      </header>
      <h3>見出し</h3>
      <p>
        テキスト
      </p>
      <footer>
        <address >
          連絡先
        </address>
      </footer>
    </section>
  </article>

一般的な使用例

  <body>
  <header>
    <div class="heder">
      <p>
        サイトタイトル
      </p>
    <!-- /heder --></div>
  </header>
  <nav>
    <div class="nav">
      <ul>
        <li><a href="#">ナビ</a></li>
        <li><a href="#">ナビ</a></li>
        <li><a href="#">ナビ</a></li>
      </ul>
    <!-- /nav --></div>
  </nav>
  <article>
  <div class="contents">
    <h1>メイン見出し</h1>
    <p>
      段落が入ります。
    </p>
    <section>
      <div class="section01">
        <h2>セクションの見出し</h2>
        <p>
          段落が入ります。
        </p>
      <!-- /section01 --></div>
    </section>
  <!-- /contents --></div>
  </article>
  <footer>
    <address>
      連絡先
    </address>
    <p>
      copyright
    </p>
  </footer>
  </body>