HTML <tbody>タグ
例
<thead>、<tbody>、および<tfoot>要素を持つHTMLテーブル：
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Sum</td>
<td>$180</td>
</tr>
</tfoot>
</table>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
タグは、HTMLテーブルの<tbody>本文コンテンツをグループ化するために使用されます。
この要素は、 <thead>および
<tfoot><tbody>要素と組み合わせて使用され、テーブルの各部分（body、header、footer）を指定します。
ブラウザはこれらの要素を使用して、ヘッダーとフッターに関係なくテーブル本体のスクロールを有効にすることができます。また、複数のページにまたがる大きなテーブルを印刷する場合、これらの要素により、テーブルのヘッダーとフッターを各ページの上部と下部に印刷できます。
注：要素には、<tbody>1つ以上の
<tr>タグが含まれている必要があります。
<tbody>タグは、次のコンテキストで使用する必要があります。<table>要素の子として、
< caption >
、 < colgroup>、および
<thead>要素の後に。
ヒント： <thead> <tbody>、、および<tfoot>要素は、デフォルトではテーブルのレイアウトに影響を与えません。ただし、CSSを使用してこれらの要素のスタイルを設定できます（以下の例を参照）。
ブラウザのサポート
| Element | |||||
|---|---|---|---|---|---|
| <tbody> | Yes | Yes | Yes | Yes | Yes |
グローバル属性
この<tbody>タグは、HTMLのグローバル属性もサポートしています。
イベント属性
この<tbody>タグは、HTMLのイベント属性もサポートしています。
その他の例
例
CSSを使用して<thead>、<tbody>、および<tfoot>のスタイルを設定します。
<html>
<head>
<style>
thead {color: green;}
tbody {color: blue;}
tfoot {color: red;}
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tbody>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Sum</td>
<td>$180</td>
</tr>
</tfoot>
</table>
例
<tbody>内のコンテンツを（CSSを使用して）整列させる方法：
<table style="width:100%">
<thead>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
</thead>
<tbody style="text-align:right">
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
例
<tbody>内のコンテンツを（CSSを使用して）垂直方向に整列させる方法：
<table style="width:50%;">
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tbody style="vertical-align:bottom">
<tr
style="height:100px">
<td>January</td>
<td>$100</td>
</tr>
<tr
style="height:100px">
<td>February</td>
<td>$80</td>
</tr>
</tbody>
</table>
デフォルトのCSS設定
ほとんどのブラウザは<tbody>、次のデフォルト値で要素を表示します。
tbody {
display: table-row-group;
vertical-align: middle;
border-color: inherit;
}