HTML <footer> タグ

定義と使用法

<footer> タグはドキュメントやセクションのフッターを定義します。

<footer> 要素は通常以下を含みます:

  • 著者情報
  • 著作権情報
  • 連絡情報
  • サイトマップ
  • トップに戻るリンク
  • 関連ページを含めることができます

ドキュメントに複数の <footer> 要素。

参照もしくは:

HTML DOMリファレンスマニュアル:Footerオブジェクト

例1

ドキュメントのフッター部分:

<footer>
  <p>著者:ビル・ゲイツ</p>
  <p><a href="mailto:bill@example.com">bill@example.com</a></p>
</footer>

実際に試してみてください

例2

CSSを使用して設定 <footer> のスタイル:

<html>
<head>
<style>
footer {
  text-align: center;
  padding: 3px;
  background-color: DarkSalmon;
  color: white;
}
</style>
</head>
<body>
<footer>
  <p>著者:Bill Gates<br>
  <a href="mailto:bill@example.com">bill@example.com</a></p>
</footer>
</body>
</html>

実際に試してみてください

ヒントとコメント

ヒント:<footer> 要素内の連絡情報は以下の場所に配置されるべきです <address> タグ内で

グローバル属性

<footer> タグは、以下のイベント属性をサポートしています HTML 中のグローバル属性

イベント属性

<footer> タグは、以下のイベント属性をサポートしています HTML 中のイベント属性

デフォルトの CSS 設定

ほとんどのブラウザは以下のデフォルト値を使用して表示します <footer> 要素:

footer {
  display: block;
}

ブラウザのサポート

テーブルの数字は、その要素を完全にサポートする最初のブラウザのバージョンを示しています。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
5.0 9.0 4.0 5.0 11.1