<tbody>

表を「ヘッダー・本体・フッター」とグループ分けしたときに、本体(内容)にあたる行を指定する要素です。この範囲にスタイルや属性をまとめて適用するのに使用します。記述する位置は<tfoot>要素の後、<colgroup>要素の前です。また、この要素は一つの表に対して複数配置することができ、ブラウザによっては、この要素にスタイルシートのoverflow を指定し、スクロールバーをつけることも可能です。


ブラウザ

IE4 / IE5 / IE5.5 / IE6 / N6 / N7 / O6 / O7 / O9 / Fx1 / Fx2 / IE5 mac

▲PageTop

仕様

・構成
要素区分 エンドタグ ネストできる要素 備考
<table>要素の子要素 省略可 <tr>要素が少なくとも1回出現しなければならない。

・属性
属性名 必須 意味
align テキストの水平方向配置
left
左端
center
中央
right
右端
justify
両端揃え
char
char属性で指定した文字で揃える
char テキストの配置の基準となる文字 配置の基準にしたい文字(alignでchar指定時に有効)
charoff char属性の文字を基準とした距離 %かpx
valign テキストの垂直方向配置
top
上端
middle
中央
bottom
下端
baseline
ベースライン
class class名 スタイルシートを設定したclass名
id id名 スタイルシートを設定したid名もしくは、任意のテキスト
title 説明文 任意のテキスト
style スタイル 任意のスタイル
lang 言語コード 例(日本語):ja
dir 読む方向
rtl
右から左に読む
ltr
左から右に読む

・イベント
イベント 仕様
onclick クリック時に発生
ondblclick ダブルクリック時に発生
onmousedown 要素上でマウスボタンを押したときに発生
onmouseup 要素上でマウスボタンを離したときに発生
onmouseover ポインティングデバイスが要素上を通過したときに発生
onmousemove ポインティングデバイスが要素上で動くと発生
onmouseout 要素の領域から出るときに発生
onkeypress 要素上でキーが押されて、要素から離れたとき発生
onkeydown 要素上でキーが押されたとき発生
onkeyup 要素上で押されたキーを離したとき発生

▲PageTop

サンプル

ソースコード

<html>
  <head>
    <title>サンプルコード</title>
  </head>
  <body>
    <table border="1" width="50%">
    <caption>行のグループ化</caption>
      <thead>
      <tr>
        <th>日にち</th><th>区分</th><th>予定</th>
      </tr>
      </thead>
      <tfoot>
      <tr>
        <td>出勤日数</td><td colspan="2">2 日間</td>
      </tr>
      </tfoot>
      <tbody>
      <tr>
        <td>12/9</td><td>出勤</td><td>会議</td>
      </tr>
      <tr>
        <td>12/27</td><td>出勤</td><td>大掃除</td>
      </tr>
      <tr>
        <td>12/29</td><td>休日</td><td>年末休み</td>
      </tr>
      </tbody>
    </table>
  </body>
</html>

表示結果

行のグループ化
日にち 区分 予定
出勤日数 2 日間
12/9 出勤 会議
12/27 出勤 大掃除
12/29 休日 年末休み

▲PageTop

関連項目

HTML

<thead> / <tfoot>


CSS

overflow 

▲PageTop