HTMLテーブル

HTMLテーブルを使用すると、Web開発者はデータを行と列に配置できます。

例

会社	連絡先	国
アルフレッド・フッターキステ	マリア・アンダース	ドイツ
モンテスマショッピングセンター	フランシスコ・チャン	メキシコ
エルンスト・ヘンデル	ローランド・メンデル	オーストリア
アイランドトレーディング	ヘレン・ベネット	イギリス
ラフィング・バッカス・ワインセラーズ	ヨシ・タンナムリ	カナダ
マガッツィーニ・アリメンタリ・リウニティ	ジョバンニ・ロヴェッリ	イタリア

HTMLテーブルを定義する

HTMLのテーブルは、行と列内のテーブルセルで構成されます。

例

シンプルなHTMLテーブル。

<table> <tr> <th>会社</th> <th>お問合せ先</th> <th>国</th> </tr> <tr> <td>アルフレッド・フッターキステ</td> <td>マリア・アンダース</td> <td>ドイツ</td> </tr> <tr> <td>セントロコマーシャルモクテスマ</td> <td>フランシスコ・チャン</td> <td>メキシコ</td> </tr> </table>

表のセル

各テーブルセルは、<td>そして</td>タグで作られます。

tdテーブルデータを表します。

<td>と</td>の中の全てが表のセルの内容です。

例

<table> <tr> <td>メール</td> <td>トバイアス</td> <td>ライナス</td> </tr> </table>

注：表のセルには、テキスト、画像、リスト、リンク、その他の表など、あらゆる種類のHTML要素を含めることができます。

表の行

テーブルの各行は<tr>で始まり、</tr>タグで終わります。

trテーブル行を表します。

例

<table> <tr> <td>メール</td> <td>トバイアス</td> <td>ライナス</td> </tr> <tr> <td>16</td> <td>14</td> <td>10</td> </tr> </table>

テーブルには好きなだけ行を含めることができます。セルの数が各行で同じであることを確認してください。

注：行に含まれるセルが他の行よりも少ない場合や多い場合があります。これについては、後の章で説明します。

テーブルヘッダー

セルをテーブルヘッダーセルにしたい場合があります。そのような場合は、<td>タグの代わりに<th>タグを使用します。

thテーブルヘッダーの略です。

例

最初の行をテーブルヘッダーセルにします。

<table> <tr> <th>人物１</th> <th>人物２</th> <th>人物３</th> </tr> <tr> <td>メール</td> <td>トバイアス</td> <td>ライナス</td> </tr> <tr> <td>16</td> <td>14</td> <td>10</td> </tr> </table>

デフォルトでは、<th>要素は太字で中央揃えですが、CSSで変更できます。