Jun. 3rd,2015
＃
要素について
| カテゴリー | なし |
| 利用場所 | “tr”要素の子要素として |
| 内容 | フロー・コンテンツ |
| タグの省略 | 直後に“td”要素か“th”要素が続く場合、もしくは親要素の中で後に続くコンテンツがない場合は終了タグを省略可能 |
“td”要素は表のセルを表す要素です。
“td”要素は親要素となる“table”要素で表される表のデータを含むセルを表します。見出しを含むセルは“th”要素で表します。
“th”要素と“td”要素は配置された順に表の行に並べられます。書字方向が左から右の場合は左側から順に並びます。
サンプルコード
<table>
<thead>
<tr>
<th>名前</th>
<th>漢字</th>
<th>英語</th>
<th>分類</th>
<th>産地</th>
<th>果実の色</th>
</tr>
</thead>
<tbody>
<tr>
<td>りんご</td>
<td>林檎</td>
<td>apple</td>
<td>バラ科リンゴ属</td>
<td>あおもり</td>
<td>あか</td>
</tr>
<tr>
<td>いちご</td>
<td>苺</td>
<td>strawberry</td>
<td>バラ科オランダイチゴ属</td>
<td>とちぎ</td>
<td>あか</td>
</tr>
<tr>
<td>もも</td>
<td>桃</td>
<td>peach</td>
<td>バラ科モモ属</td>
<td>やまなし</td>
<td>もも</td>
</tr>
</tbody>
<tfoot>
<tr>
<th>名前</th>
<th>漢字</th>
<th>英語</th>
<th>分類</th>
<th>産地</th>
<th>果実の色</th>
</tr>
</tfoot>
</table>
| 名前 | 漢字 | 英語 | 分類 | 産地 | 果実の色 |
|---|---|---|---|---|---|
| りんご | 林檎 | apple | バラ科リンゴ属 | あおもり | あか |
| いちご | 苺 | strawberry | バラ科オランダイチゴ属 | とちぎ | あか |
| もも | 桃 | peach | バラ科モモ属 | やまなし | もも |
| 名前 | 漢字 | 英語 | 分類 | 産地 | 果実の色 |
＃
属性と値
| 属性 | 値 | ||
|---|---|---|---|
| 属性 | 説明 | 値 | 説明 |
| 必須属性 | |||
| なし | |||
| 任意属性 | |||
| グローバル属性 | |||
| colspan="" | セルが範囲とする列の数 | 正の整数 | セルが範囲とする列の数 |
| rowspan="" | セルが範囲とする行の数 | 正の整数 | セルが範囲とする行の数 |
| 0 | 行グループ内で後に続くすべての行 | ||
| headers="" | セルに関連付ける見出し | ID名 | 関連づける“th”要素の“id”属性の値 |
過去に定義されていた属性
| 属性 | 値 | ||
|---|---|---|---|
| 属性 | 説明 | 値 | 説明 |
abbr="" |
セルの内容の省略形 | テキスト | セルの内容の省略形 |
| axis="" |
セルの内容の分類名 | テキスト | セルの内容の分類名 |
| scope="" |
見出しの対象範囲 | row | 同じ行のセル |
| col | 同じ列のセル | ||
| rowgroup | 同じ行グループ内のセル | ||
| colgroup | 同じ列グループ内のセル | ||
| nowrap="" |
セル内のテキストを改行させない | nowrap | セル内のテキストを改行させない |
| width="" |
セルの横幅 | 正の整数 | 横幅のピクセル数 |
| 正の整数% | 横幅の表示領域に対する割合 | ||
| height="" |
セルの高さ | 正の整数 | 高さのピクセル数 |
| 正の整数% | 高さの表示領域に対する割合 | ||
| align="" |
セルの内容の水平方向の表示位置 | left | 左揃え |
| center | 中央揃え | ||
| right | 右揃え | ||
| justify | 両端揃え | ||
| char | “char”属性で指定した文字を揃える | ||
| char="" |
揃え文字の指定 | 文字 | 揃え文字 |
| charoff="" |
セルの端から揃え文字までの距離 | 正の整数 | セルの端から揃え文字までの距離のピクセル数 |
| 正の整数% | セルの端から揃え文字までの距離の表示領域に対する割合 | ||
| valign="" |
セルの内容の垂直方向の表示位置 | top | セルの上端に揃える |
| middle | セルの中央に揃える | ||
| bottom | セルの下端に揃える | ||
| baseline | 1行目をベースラインで揃える | ||
| bgcolor="" |
セルの背景色 | 色 | セルの背景色 |
＃
仕様書
“td”要素はHTML2.0の後に発行された“HTML Tables (RFC 1942)”から定義されている要素です。現行の仕様であるHTML Living Standardでも定義されています。
定義されている仕様書
 |
 |
 |
 |
 |
|
|---|---|---|---|---|---|
| <td> |   |
|
|
|
|
DOMインターフェース
[Exposed=Window]
interface HTMLTableCellElement : HTMLElement {
[HTMLConstructor] constructor();
[CEReactions] attribute unsigned long colSpan;
[CEReactions] attribute unsigned long rowSpan;
[CEReactions] attribute DOMString headers;
readonly attribute long cellIndex;
[CEReactions] attribute DOMString scope; // only conforming for th elements
[CEReactions] attribute DOMString abbr; // only conforming for th elements
// also has obsolete members
};
UAスタイルシート
@namespace url(http://www.w3.org/1999/xhtml);
td {
unicode-bidi: isolate;
display: table-cell;
padding: 1px;
vertical-align: inherit;
}
table[rules=none i] > tr > td, table[rules=groups i] > tr > td, table[rules=rows i] > tr > td, table[rules=cols i] > tr > td, table[rules=all i] > tr > td, table[rules=none i] > thead > tr > td, table[rules=groups i] > thead > tr > td, table[rules=rows i] > thead > tr > td, table[rules=cols i] > thead > tr > td, table[rules=all i] > thead > tr > td, table[rules=none i] > tbody > tr > td, table[rules=groups i] > tbody > tr > td, table[rules=rows i] > tbody > tr > td, table[rules=cols i] > tbody > tr > td, table[rules=all i] > tbody > tr > td, table[rules=none i] > tfoot > tr > td, table[rules=groups i] > tfoot > tr > td, table[rules=rows i] > tfoot > tr > td, table[rules=cols i] > tfoot > tr > td, table[rules=all i] > tfoot > tr > td {
border-color: black;
}
/* 文書の文字エンコーディングが ISO-8859-8 である場合 */
td {
unicode-bidi: bidi-override;
}
