一覧表や年表など、表形式にまとめて記述するソースを含むページを作成する場合はtable要素で表を作成します。

基本構造

例)

<table>
<tr><td>1972年</td></tr>
</table>

table要素,tr要素,td要素

※table要素にwidth: 300px、td要素にborder: 1px solid #cdcdcd;を指定。


table要素
テーブル(表)を定義する基本要素となります。

tr要素
table要素の中で表の行を定義します。

td要素
tr要素の中で表の列を定義し、表の各セル(内容)を指定します。


行を増やす

tr要素を、必要な行の数だけ記述します。また、行の数と同じ数のセルが必要になりますので、td要素も同じく記述します。

例)

<table>
<tr><td>1972年</td></tr>
<tr><td>1973年</td></tr>
<tr><td>1974年</td></tr>
</table>

table要素,tr要素,td要素

※table要素にwidth: 300px、td要素にborder: 1px solid #cdcdcd;を指定。

列を増やす

tr要素の中にtd要素を必要な列の数だけ記述します。

例)

<table>
<tr><td>1972年</td><td>1973年</td></tr>
<tr><td>1974年</td><td>1975年</td></tr>
</table>

table要素,tr要素,td要素

※table要素にwidth: 300px、td要素にborder: 1px solid #cdcdcd;を指定。


th要素

th要素はtr要素の中で表内の見出になるセルを指定します。td要素と同じくtr要素の中で表の各セル(内容)となる表の列を定義しますが、td要素と違う点は、セルの内容が見出しである事と、内容の表示が太字、中央揃えで表示される事です。

例)

<table>
<tr><th>年号</th><th>人数</th></tr>
<tr><td>1972</td><td>100</td></tr>
<tr><td>1974</td><td>110</td></tr>
</table>

table要素,tr要素,th要素,td要素

※table要素にwidth: 300px、th,td要素にborder: 1px solid #cdcdcd;を指定。


ページトップへ戻る



RAWで撮ろうLife with a cameraLife with a camera 2


inserted by FC2 system