<tbody> - テーブルボディ

目次

概要

形式
<tbody>～</tbody>
サポート
https://caniuse.com/mdn-html_elements_tbody
カテゴリ
該当なし
親要素
table 要素。ただし、caption, colgroup, thead 要素より後ろに記述すること。また、table 要素の直接の子要素としての tr 要素は記述しないこと。
子要素
0個以上の tr, スクリプトサポート要素
タグの省略
開始タグ: 最初の子要素が tr 要素であり、また、終了タグが省略された tbody, thead, tfoot 要素の直後でない場合は省略可能。
終了タグ: tbody, tfoot 要素が直後に続く場合、または、親要素に対して最後の要素の場合、省略可能。
属性
グローバル属性

説明

テーブルの行を、ヘッダ行、フッタ行、ボディ行に明示的に分ける場合のボディ行を指定します。

属性

グローバル属性
詳細は グローバル属性 を参照してください。
bgcolor=color
[非推奨] e4/Ch/Fx/Sa/Op/N6
背景色を指定します。
align=align
[非推奨] H4-4/e4/Ch/Fx/Sa/Op/N6
表示位置を指定します。HTML5 では廃止されました。
center
中央表示(H4/e4/Ch/Fx/Sa/Op)
char
指定文字揃え(H4)
justify
均等割付(H4)
left
左寄せ(H4/e4/Ch/Fx/Sa/Op)
right
右寄せ(H4/e4/Ch/Fx/Sa/Op)
valign=valign
[非推奨] H4-4/e4/Ch/Fx/Sa/Op/N6
セルの中に表示される縦位置を指定します。HTML5 では廃止されました。
baseline
ベースライン(H4/e4/Ch/Fx/Sa/Op)
bottom
下側(H4/e4/Ch/Fx/Sa/Op)
middle
中央(H4/e4/Ch/Fx/Sa/Op)
top
上側(H4/e4/Ch/Fx/Sa/Op)
char=char
[非推奨] H4-4
位置揃えする文字を指定します。HTML5 では廃止予定です。
charoff=n
[非推奨] H4-4
char 属性で指定した文字を、セルの左端からどのくらいの位置に表示するかのオフセットを指定します。HTML5 では廃止されました。

使用例

CSS
.table1 {
  border-collapse: collapse;
}
.table1 th, .table1 td {
  border: 1px solid gray;
}
HTML
<table class="table1" style="border-collapse:collapse; width:250px;">
 <caption>【表の例】</caption>
 <thead style="background-color:#ccc;">
  <tr>
   <th>品名</th>
   <th>単価</th>
   <th>個数</th>
   <th>価格</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>ぬいぐるみ</td>
   <td>3,200</td>
   <td>1</td>
   <td>3,200</td>
  </tr>
  <tr>
   <td>チョコレート</td>
   <td>800</td>
   <td>3</td>
   <td>2,400</td>
  </tr>
 </tbody>
 <tfoot>
  <tr>
   <td>合計</td>
   <td><br></td>
   <td><br></td>
   <td>5,600</td>
  </tr>
 </tfoot>
</table>
表示
【表の例】
品名 単価 個数 価格
ぬいぐるみ 3,200 1 3,200
チョコレート 800 3 2,400
合計

5,600

詳細

tbody と tfoot の順番の注意

HTML4.01では、ヘッダとフッタを先読みして表示するために、<tbody> よりも <tfoot> の方を先に記述しなくてはならないと定義されていました。しかし、この仕様に対応しないブラウザも少なからずありました。

HTML
<table>
 <thead><tr><td>HEAD</td></tr></thead>
 <tfoot><tr><td>FOOT</td></tr></tfoot>
 <tbody><tr><td>BODY</td></tr></tbody>
</table>

HTML5 では <tfoot> と <tbody> の順番はどちらでもよいことになりました。さらに HTML 5.1 では、<tbody> → <tfoot> の順番で記述するよう、仕様が改めました。

Copyright (C) 1996-2017 杜甫々
初版:1996年9月10日 最終更新:2017年12月31日
https://www.tohoho-web.com/html/tbody.htm