HTML <table> タグ

2 行 2 列の簡単な HTML テーブル：

<table>
<tr>
    <th>Month</th>
    <th>Savings</th>
</tr>
<tr>
    <td>January</td>
    <td>$100</td>
</tr>
</table>

他の "Try it Yourself" の例が下にあります。

定義と用法

<table> タグは、HTML テーブルを定義します。

HTML テーブルは、<table> 要素と 1 つ以上の<tr>、 <th> および <td> 要素から構成されます。

<tr> 要素は、テーブルの行を定義し、<th> 要素はテーブルの見出しを、<td> 要素はテーブルのセルを定義します。

もっと複雑な HTML テーブルは、<caption>、<col>、<colgroup>、<thead>、 <tfoot>、<tbody> 要素を含むこともできます。

要素
<table>	Yes	Yes	Yes	Yes	Yes

"align"、"bgcolor"、"cellpadding"、"cellspacing"、"frame"、"rules"、 "summary"、"width" 属性は、HTML5 ではサポート対象外です。

属性	値	説明
align	left center right	HTML5 ではサポート対象外。周囲のテキストに従ってテーブルの配置を指定する
bgcolor	rgb(x,x,x) #xxxxxx colorname	HTML5 ではサポート対象外。テーブルの背景色を指定する
border	1 0	テーブルをレイアウト用に使用しているかどうかを指定
cellpadding	pixels	HTML5 ではサポート対象外。セルの仕切りとセルのコンテンツとの間のスペースを指定する
cellspacing	pixels	HTML5 ではサポート対象外。セル間のスペースを指定する
frame	void above below hsides lhs rhs vsides box border	HTML5 ではサポート対象外。どちらの外側部分のボーダーを表示するかを指定する
rules	none groups rows cols all	HTML5 ではサポート対象外。どちらの内側部分のボーダーを表示するかを指定する
sortable	sortable	Specifies that the table should be sortable
summary	text	HTML5 ではサポート対象外。テーブルのコンテンツの要約を指定する
width	pixels %	HTML5 ではサポート対象外。テーブルの幅を指定する

<table> タグは、HTML のグローバル属性もサポートします。

<table> タグは、HTML のイベント属性もサポートします。

テーブルの見出し
テーブルの見出しを作成する方法。

表題付きテーブル
表題付きの HTML テーブル。

テーブル内のタグ
他の要素内に要素を表示する方法。

複数の行/列にまたがるセル
複数の行または列にまたがるテーブル・セルの定義方法。

ほとんどのブラウザは、次のデフォルト値を使用して <table> 要素を表示しています：

table {
    display: table;
    border-collapse: separate;
    border-spacing: 2px;
    border-color: gray;
}