Webエンジニア向けプログラミング解説動画をYouTubeで配信中!
▶ チャンネル登録はこちら

【HTML Living Standard】tfoot要素の使い方

tfoot要素の使い方について、初心者にもわかりやすく解説します。

作成日: 更新日:

基本的な使い方

tfootオブジェクトは、HTMLのテーブルにおいて、フッター部分をグループ化するために使用されるオブジェクトです。このオブジェクトは、テーブル全体の集計結果や合計値、あるいは補足情報、注釈などを意味的にまとめる役割を担います。これにより、テーブルの構造がより明確になり、データの内容を理解しやすくなります。

tfootオブジェクトは、<table>要素の直接の子要素として配置され、<thead>(テーブルヘッダー)や<tbody>(テーブルボディ)といった他のグループ化要素と組み合わせて使用されます。HTMLのソースコード上では、<tbody>要素の後に記述されるのが一般的です。ブラウザによる実際のレンダリングでは、CSSによる特別な指定がない限り、テーブルの一番下の行として表示されます。tfootオブジェクト内には、<tr>(テーブルの行)要素を配置し、その中に<th>(ヘッダーセル)や<td>(データセル)といったセル要素を記述して、具体的なフッターの内容を定義します。

このオブジェクトを使用することで、視覚的な整形だけでなく、スクリーンリーダーなどの補助技術を利用するユーザーにとっても、テーブルのフッター情報がどこにあるかを明確に伝えることができます。また、大規模なテーブルを印刷する際に、各ページにフッター情報を繰り返し表示させるといった、特定のスタイル設定や機能を実現する上でも重要な意味を持ちます。テーブルの構造を論理的に分割し、データの意味付けを強化する点で、Webページのアクセシビリティと保守性の向上に貢献する重要な要素です。

公式リファレンス: <tfoot>: The Table Foot element

構文(syntax)

1<tfoot>
2  <tr>
3    <td>フッターセル1</td>
4    <td>フッターセル2</td>
5  </tr>
6</tfoot>

引数(parameters)

引数なし

引数はありません

戻り値(return)

戻り値なし

戻り値はありません

関連コンテンツ