<tbody> - テーブル本体部

トップ > HTMLリファレンス > <tbody>

概要

項目説明
形式<tbody>~</tbody>
サポートH4 / e4 / Ch1 / Fx1 / Sa1 / Op1 / N6
カテゴリ該当なし
親要素table要素
子要素tr, script, template要素
タグの省略開始タグ:省略可能 / 終了タグ:省略可能

説明

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

属性

【固有属性】
属性意味
bgcolor=colore4/Ch/Fx/Sa/Op/N6。背景色を指定します。
align=alignH4-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=valignH4-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=charH4-4。位置揃えする文字を指定します。HTML5 では廃止予定です。
charoff=nH4-4。char 属性で指定した文字を、セルの左端からどのくらいの位置に表示するかのオフセットを指定します。HTML5 では廃止されました。
【一般属性】
属性意味
accesskey=keyH4/e4/Ch2/Fx2/Sa3/Op12/N6/i1。アクセスキーを指定します。
class=classH4/e3/Ch1/Fx1/Sa1/Op1/N4。クラスを指定します。
contenteditable=boolH5/e55/Ch11/Fx3/Op10.6/Sa3.2。要素を編集可能にします。
dir=dirH4/e5/Ch5/Fx4/Sa6/Op25/N6。文字の表示方向を指定します。
hiddenH5/e/Ch/Fx/Sa/Op。要素を非表示にします。
id=idH4/e3/Ch/Fx/Sa/Op/N4。ID を指定します。
lang=langH4/e4/Ch/Fx/Sa/Op/N6。言語を指定します。
spellcheck=boolH5。スペルをチェックします。
style=styleH4/e3/Ch/Fx/Sa/Op/N4。スタイルシートを指定します。
tabindex=nH4/e4/Ch/Fx/Sa/Op/N6。タブインデックスを指定します。
title=titleH2/e2/Ch/Fx/Sa/Op/N6。タイトルを指定します。
translate=titleH5。翻訳可否を指定します。

使用例

HTML
<table border=1 style="border-collapse:collapse; width:250px;">
 <caption>【表の例】</caption>
 <thead style="background-color:#cccccc;">
  <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> の方を先に記述しなくてはならないと定義されています。

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

しかし、上記のように記述すると、IE5.0 などでは HEAD → BODY → FOOT の順に表示するのですが、<tfoot> に未対応の古いブラウザでは、HEAD → FOOT → BODY の順に表示されてしまいます。また、HTML5 では、<tfoot> と <tbody> の順番はどちらでもよいことになりました。

関連項目

<table><caption><tr><th><td><thead><tfoot><col><colgroup>

Copyright (C) 1996-2015 杜甫々
初版:1996年9月10日 最終更新:2015年1月24日
http://www.tohoho-web.com/html/tbody.htm