<td> 【テーブル(表)のセルを作成】

[IE5] [IE6] [IE7] [Fx1] [Fx2] [Op8] [Op9] [Ns6] [Ns7]

<td>タグは、テーブル(表)のセルを作成する場合に指定します。見出しとなるセルを作る場合には<th>タグを使用します。

テーブル作成の基本的な流れは以下の通り。
まず<table>タグで表の作成を開始します。
次に<tr>タグで表の横一列を定義します。
そして<td>タグで表の縦のセルを定義します。

与えられる属性

cellspan="値"
隣接するセルの横何個分に相当するのかを指定。

rowspan="値"
隣接するセルの縦何個分に相当するのかを指定。

align="left, center, right"
セルの内容物の表示位置を指定。

valign="top, middle, bottom, baseline"
セルの内容物の縦軸に対する表示位置を指定。

width="値"
テーブル全体の幅を指定します。

height="値"
テーブル全体の高さを指定します。

border="値"
枠線(ボーダー)の太さを指定します。

bordercolor="値"
枠線(ボーダー)の色を指定します。

bgcolor="値"
背景色を指定します。

<td>の使用例

ソース

<table border="1" bordercolor="#000000" bgcolor="#ffffff" cellpadding="3">
<tr>
<th align="center" colspan="3">テーブルの作成</th></tr>
<tr>
<td>1</td>
<td>TABLE</td>
<td>テーブル全体の開始</td>
</tr>
<tr>
<td>2</td>
<td>TR</td>
<td>横一列を定義する</td>
</tr>
<tr>
<td>3</td>
<td>TD</td>
<td>TRの中にセルを作成</td>
</tr>
<tr>
<td>4</td>
<td>/TD</td>
<td>セル内の内容を記述してセルを閉じる</td>
</tr>
<tr>
<td>5</td>
<td>TD〜/TD</td>
<td>複数セルを表示させる場合には繰り返しTDを記述</td>
</tr>
<tr>
<td>6</td>
<td>/TR</td>
<td>一行分の記述が終わったらTRを閉じる</td>
</tr>
<tr>
<td>7</td>
<td>TR, TD, /TD, /TR</td>
<td>必要回数繰り返す</td>
</tr>
<tr>
<td>8</td>
<td>/TABLE</td>
<td>テーブル全体を終了させる</td>
</tr>
</table>

表示すると

テーブルの作成
1 TABLE テーブル全体の開始
2 TR 横一列を定義する
3 TD TRの中にセルを作成
4 /TD セル内の内容を記述してセルを閉じる
5 TD〜/TD 複数セルを表示させる場合には繰り返しTDを記述
6 /TR 一行分の記述が終わったらTRを閉じる
7 TR, TD, /TD, /TR 必要回数繰り返す
8 /TABLE テーブル全体を終了させる

表、テーブル 関連項目

<table> テーブル(表)を作成する 
<tr> テーブル(表)の横一行を定義する 
<th> テーブル(表)の見出しとなるセルを作成 
<td> テーブル(表)のセルを作成 
<caption> テーブル(表)にタイトルを付ける 
<thead> テーブル(表)のヘッダ行を定義する 
<tfoot> テーブル(表)のフッタ行を定義する 
<tbody> テーブル(表)のボディ部分を定義する 
<col> テーブル(表)の縦列の属性をまとめて指定する 
<colgroup> テーブル(表)の縦列をグループ化する 
<spacer> スペースを挿入する(NN独自) 
<multicol> 段組する(NN独自) 

戻る

TOP

WEB SEARCH
MENU
CONTENTS
digilog.TOP
digilog.HTML
digilog.CSS
digilog.SEO
digilog.img