tbody要素
tbody要素の役割
tbody要素は、複数の行をひとつのグループとして扱うときに使用します。
tbody要素は、table要素内において、複数のtr要素を囲うようにして使います。
tbody要素に設定できる属性
属性名 | 意味 |
align | まとめたセルすべてのテキスト等の配置を指定。 |
char | セル内の位置をそろえる際の基準となる文字を指定。 |
charoff | char属性で指定した文字を基準に揃える際に横方向にどれだけずらすかを指定する。 |
class | クラス名。CSSを適用するときなどに使用する。 |
dir | 文字表記の方向。左から右(ltr)と、右から左(rtl)を指定する。通常はltrなので、右から左へ表記する言語を使わないのであれば、指定しなくてよい。 |
id | ID名。CSSを適用するときに使用する。 |
lang | 言語コード。日本語、英語といった言語を指定する。html要素に記述してあれば、明示する必要はない。 |
style | スタイルシートを直接記述する。 |
title | 補足情報。テキストにカーソルを合わせるとtitle属性に指定した文字列をポップアップで表示する。 |
valign |
tbody要素の使い方
<table width="100%" border="1">
<tbody align="center">
<tr><td>一行目</td><td>データ</td></tr>
<tr><td>二行目</td><td>データ</td></tr>
</tbody>
<tr><td>三行目</td><td>データ</td></tr>
</table>
一行目 | データ |
二行目 | データ |
三行目 | データ |
align属性
center | 中央揃えで表示する。 |
char | char属性で指定した文字を基準にして揃える。 |
justify | テキストを両端揃えで表示する。 |
left | 左寄りに表示する。 |
right | 右寄りに表示する。 |
char属性、charoff属性
char属性による位置揃えとは、たとえば小数点で数字を合わせたい場合などに用いられます。この場合、
<tbody align="char" char=".">
と書くと、半角ピリオドを基準として、テキストをそろえて表示します。ただし、現時点ではchar属性に対応したブラウザはありません。
charoff属性は、char属性で指定した文字から、どの何文字分ずらして表示するかを指定します。小数点第何位でそろえるか、というような場合に用いられますが、現在ではこの属性をサポートしたブラウザはありません。
valign属性
baseline | テキストの1行目をベースラインに合わせて表示する。 |
bottom | 下側に寄せて表示する。 |
middle | 垂直方向の中央に位置するように表示する。 |
top | 上側に寄せて表示する。 |
ベースラインとは、アルファベットにおいて使われる概念です。
アルファベットには、下に突き抜けるように書く文字(特に小文字に多い。gやjなど)と下に突き抜けない文字(大文字。ABC)があります。この下に突き抜けない文字の下に位置する部分がベースラインです。
関連リンク
よく読まれている記事
- 右クリックメニューの表示が遅い【Information】
- 画像の一部にリンクを貼る(クリッカブルマップ【Dreamweaver】
- 一定時間でローテーションする広告【JavaScript】
- Dreamweaver【Dreamweaver】
- クリックした画像を拡大・縮小する【JavaScript】
UpDate:2010-6-2