表を作る

[統計] HTMLからXHTMLへの移行を進めていますか?


<table><tr><td>

ブラウザ
Internet Explorer Netscape Firefox Opera
タイプ
ブロック要素

表を作成するタグです。tableタグtrタグtdタグを組み合わせて使用します。


<table>
<tr>
<td>
表の内容</td>
</tr>
</table>


表作りのイメージ

tableタグ <table></table>

表全体を指定するタグです。

trタグ <tr></tr>

行を指定するタグです。tableタグに囲まれた部分で使用します。

tdタグ <td></td>

セルを指定するタグです。trタグに囲まれた部分で使用します。

メモ

タグインデックスの使用例では省いていますが、HTML4.01ではtbodyタグ(行のグループ化)の指定が必須とされています。


使用例

※分かりやすくするために、このサンプルではtableタグborder属性を加えています。
 (borderを指定しないと、枠の線は表示されません。)


1行の中に3列のセルを作ってみます

<table border="3">
<tr>
<td>ホームページ作成A社</td>
<td>ホームページ作成B社</td>
<td>ホームページ作成C社</td>
</tr>
</table>

これをブラウザで見ると次のように表示されます

ホームページ作成A社 ホームページ作成B社 ホームページ作成C社

3列のセルを2行作ってみます

<table border="3">
<tr>
<td>サーバーA社</td>
<td>サーバーB社</td>
<td>サーバーC社</td>
</tr>
<tr>
<td>サーバーD社</td>
<td>サーバーE社</td>
<td>サーバーF社</td>
</tr>
</table>

これをブラウザで見ると次のように表示されます

サーバーA社 サーバーB社 サーバーC社
サーバーD社 サーバーE社 サーバーF社

3列のセルを2行作ってみます(borderを指定しない例)

<table>
<tr>
<td>サーバーA社</td>
<td>サーバーB社</td>
<td>サーバーC社</td>
</tr>
<tr>
<td>サーバーD社</td>
<td>サーバーE社</td>
<td>サーバーF社</td>
</tr>
</table>

これをブラウザで見ると次のように表示されます

サーバーA社 サーバーB社 サーバーC社
サーバーD社 サーバーE社 サーバーF社


[特集] レンタルサーバー比較 & サーバー選びのチェックポイント