HTML CSS 講座 トップページへ

ホームページ作成 いまさらHTML,CSS講座

|  Home  |  ホームページ作成の知識  |  HTML 講座  |  HTML TABLE 講座  |  スタイルシート(CSS) 講座  |  携帯サイト 作成 講座  |
[HTMLテンプレートカテゴリ] [未分類カテゴリ]

いまさらHTML,CSS講座トップ > HTML4.01 TABLE 講座インデックス > TABLE(表) 基本構造
様々なブックマークサービスがご利用頂けます。

テーブル(表) TABLE 基本構造

一覧表や年表など、表形式にまとめて記述する必要があるソースを含むページを作成する場合は、
table要素で表を作成します。
ソース  ソース 基本
<table>
 <tr><td>1972</td></tr>
</table>
表示  表 示
■ table 要素
テーブル(表)を定義する基本要素となります。
■ tr 要素
table要素の中で表の行を定義します。
■ td 要素
tr 要素の中で表の列を定義し、表の各セル(内容)を指定します。
■ 行を増やす
tr 要素を、必要な行の数だけ記述します。
また、行の数と同じ数のセルが必要になりますので、td 要素も同じく記述します。
ソース  ソース 基本
<table>
 <tr><td>1972</td></tr>
 <tr><td>1973</td></tr>
 <tr><td>1974</td></tr>
</table>
表示  表 示
 サンプル表示では、border="1" が指定してあります。

■ 列を増やす
tr要素の中に、td 要素を、必要な列の数だけ記述します。
ソース  ソース 基本
<table>
 <tr><td>1972</td><td>1973</td><td>1974>/td></tr>
 <tr><td>1975</td><td>1976</td><td>1977>/td></tr>
</table>
表示  表 示
 サンプル表示では、border="1" が指定してあります。
■ th 要素
tr 要素の中で、表内の見出になるセルを指定します。
td 要素と同じく、tr 要素の中で表の各セル(内容)となる表の列を定義します。
td 要素と違う点は、セルの内容が、見出しである事と、内容の表示が、太字、中央揃えで表示される事です。
ソース  ソース 基本
<table>
 <tr><th>年号</th><th>人数</th></tr>
 <tr><td>1972</td><td>100</td></tr>
 <tr><td>1973</td><td>110</td></tr>
 <tr><td>1974</td><td>120</td></tr>
</table>
表示  表 示
 サンプル表示では、table 要素に、border="1" width="120" が指定してあります。

(C) いまさらHTML CSS講座 2002-2008 All right reserved