Jun. 3rd,2015
＃
要素について
| カテゴリー | なし |
| 利用場所 | “table”要素の子要素として“caption”要素や“colgroup”要素、“thead”要素の後に(ただし、“table”要素が子要素に“tr”要素を持たない場合) |
| 内容 | 0個以上の“tr”要素とスクリプト支援要素 |
| タグの省略 | “tbody”要素の最初の子要素が“tr”要素で直前に終了タグが省略された“tbody”要素や“thead”要素、“tfoot”要素がない場合は開始タグを省略可能 |
| 直後に“tbody”要素もしくは“tfoot”要素が続く場合や親要素の中で後に続くコンテンツがない場合は終了タグを省略可能 |
“tbody”要素は表の本体部分を表す要素です。
表の見出し部分などを除いたデータをグループ化するのために使用することができます。
“tbody”要素を使用する場合はその“table”要素の中に直接“tr”要素を配置することはできません。この場合はすべての“tr”要素を“tbody”要素もしくは“thead”要素や“tfoot”要素の中に入れなければなりません。
サンプルコード
<table>
<thead>
<tr>
<th>県名</th>
<th>人口</th>
<th>面積(km<sup>2</sup>)</th>
</tr>
</thead>
<tbody>
<tr>
<th>徳島</th>
<td>723,096</td>
<td>4,146.75</td>
</tr>
<tr>
<th>香川</th>
<td>950,799</td>
<td>1,876.78</td>
</tr>
<tr>
<th>愛媛</th>
<td>1,330,122</td>
<td>5,676.16</td>
</tr>
<tr>
<th>高知</th>
<td>691,602</td>
<td>7,103.64</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>合計</th>
<td>3,695,619</td>
<td>18,803.33</td>
</tr>
</tfoot>
</table>
| 県名 | 人口 | 面積(km2) |
|---|---|---|
| 徳島 | 723,096 | 4,146.75 |
| 香川 | 950,799 | 1,876.78 |
| 愛媛 | 1,330,122 | 5,676.16 |
| 高知 | 691,602 | 7,103.64 |
| 合計 | 3,695,619 | 18,803.33 |
“tbody”要素は“table”要素の中に複数配置することができます。
<table>
<thead>
<tr>
<th>県名</th>
<th>人口</th>
<th>面積(km<sup>2</sup>)</th>
</tr>
</thead>
<tbody style=" background-color: rgb(251,196,204);">
<tr>
<th>徳島</th>
<td>723,096</td>
<td>4,146.75</td>
</tr>
<tr>
<th>香川</th>
<td>950,799</td>
<td>1,876.78</td>
</tr>
<tr>
<th>愛媛</th>
<td>1,330,122</td>
<td>5,676.16</td>
</tr>
<tr>
<th>高知</th>
<td>691,602</td>
<td>7,103.64</td>
</tr>
</tbody>
<tbody style=" background-color: rgb(221,231,197);">
<tr>
<th>福岡</th>
<td>5,109,906</td>
<td>4,986.52</td>
</tr>
<tr>
<th>佐賀</th>
<td>809,964</td>
<td>2,440.68</td>
</tr>
<tr>
<th>長崎</th>
<td>1,314,078 </td>
<td>4,130.88</td>
</tr>
<tr>
<th>熊本</th>
<td>1,738,173</td>
<td>7,409.48</td>
</tr>
<tr>
<th>大分</th>
<td>1,127,462</td>
<td>6,340.73</td>
</tr>
<tr>
<th>宮崎</th>
<td>1,065,283 </td>
<td>7,735.32</td>
</tr>
<tr>
<th>鹿児島</th>
<td>1,592,237</td>
<td>9,187.01</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>合計</th>
<td>16,452,722</td>
<td>61034.81</td>
</tr>
</tfoot>
</table>
| 県名 | 人口 | 面積(km2) |
|---|---|---|
| 徳島 | 723,096 | 4,146.75 |
| 香川 | 950,799 | 1,876.78 |
| 愛媛 | 1,330,122 | 5,676.16 |
| 高知 | 691,602 | 7,103.64 |
| 福岡 | 5,109,906 | 4,986.52 |
| 佐賀 | 809,964 | 2,440.68 |
| 長崎 | 1,314,078 | 4,130.88 |
| 熊本 | 1,738,173 | 7,409.48 |
| 大分 | 1,127,462 | 6,340.73 |
| 宮崎 | 1,065,283 | 7,735.32 |
| 鹿児島 | 1,592,237 | 9,187.01 |
| 合計 | 16,452,722 | 61034.81 |
＃
属性と値
| 属性 | 値 | ||
|---|---|---|---|
| 属性 | 説明 | 値 | 説明 |
| 必須属性 | |||
| なし | |||
| 任意属性 | |||
| グローバル属性 | |||
過去に定義されていた属性
| 属性 | 値 | ||
|---|---|---|---|
| 属性 | 説明 | 値 | 説明 |
align="" |
セルの内容の水平方向の表示位置 | left | 左揃え |
| center | 中央揃え | ||
| right | 右揃え | ||
| justify | 両端揃え | ||
| char | “char”属性で指定した文字を揃える | ||
| char="" |
揃え文字の指定 | 文字 | 揃え文字 |
| charoff="" |
セルの端から揃え文字までの距離 | 正の整数 | セルの端から揃え文字までの距離のピクセル数 |
| 正の整数% | セルの端から揃え文字までの距離の表示領域に対する割合 | ||
| valign="" |
セルの内容の垂直方向の表示位置 | top | セルの上端に揃える |
| middle | セルの中央に揃える | ||
| bottom | セルの下端に揃える | ||
| baseline | 1行目をベースラインで揃える | ||
＃
仕様書
“tbody”要素はHTML2.0の後に発行された“HTML Tables (RFC 1942)”から定義されている要素です。現行の仕様であるHTML Living Standardでも定義されています。
DOMインターフェース
[Exposed=Window]
interface HTMLTableSectionElement : HTMLElement {
[HTMLConstructor] constructor();
[SameObject] readonly attribute HTMLCollection rows;
HTMLTableRowElement insertRow(optional long index = -1);
[CEReactions] undefined deleteRow(long index);
// also has obsolete members
};
UAスタイルシート
@namespace url(http://www.w3.org/1999/xhtml);
tbody {
unicode-bidi: isolate;
display: table-row-group;
vertical-align: middle;
border-color: inherit;
}
tbody[hidden] {
display: table-row-group;
visibility: collapse;
}
/* 文書の文字エンコーディングが ISO-8859-8 である場合 */
tbody {
unicode-bidi: bidi-override;
}
