<thead>、<tfoot>、<tbody> 要素を持つ HTML テーブル：
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tfoot>
<tr>
<td>Sum</td>
<td>$180</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
Try it Yourself ❯
<tfoot> タグは、HTML テーブルにおけるフッタ・コンテンツをグループ化するために使用します。
<tfoot> 要素は、テーブルの各部分 (body, header, footer) を指定するために、 <thead>、<tbody> と共に使用します。
ブラウザは、ヘッダおよびフッタとは独立に、テーブル本体のスクロールを可能にするため、 これらの要素を使用することができます。 また、多数のページにまたがる大きなテーブルを印刷する場合、これらの要素によって、 テーブルのヘッダおよびフッタを各ページの上部と下部に印刷することができるようになります。
<tfoot> タグは、次のコンテキストで使用しなければなりません： <table> 要素の子として、<caption>、<colgroup>、<thead> 要素の後。
| 要素 | |||||
|---|---|---|---|---|---|
| <tfoot> | Yes | Yes | Yes | Yes | Yes |
注: <tfoot> 要素の中には、1 つ以上の <tr> タグがなければなりません。
チップ: <thead>、<tbody>、<tfoot> 要素は、デフォルトでは、 テーブルのレイアウトには影響しませんが、これらの要素のスタイルには CSS を使用することができます。
HTML 4.01 の属性は、いずれも HTML5 ではサポートされません。
| 属性 | 値 | 説明 |
|---|---|---|
| align | right left center justify char |
HTML5 ではサポート対象外。 <tfoot> 要素内のコンテンツを配置する |
| char | character | HTML5 ではサポート対象外。 <tfoot> 要素内のコンテンツを或る文字に揃える |
| charoff | number | HTML5 ではサポート対象外。 char 属性で指定した文字から配置された <tfoot> 要素内のコンテンツの文字数を設定する |
| valign | top middle bottom baseline |
HTML5 ではサポート対象外。 <tfoot> 要素内のコンテンツを縦方向に配置する |
<tfoot> タグは、HTML のグローバル属性もサポートします。
<tfoot> タグは、HTML のイベント属性もサポートします。
ほとんどのブラウザは、次のデフォルト値を使用して <tfoot> 要素を表示しています：
tfoot {
display: table-footer-group;
vertical-align: middle;
border-color: inherit;
}