HTML Tag Reference

table 要素

表組みを表す

table 要素は表組み(テーブル)を表します。

table 要素は直接の子要素として、caption 要素colgroup 要素thead 要素tfoot 要素tbody 要素tr 要素のみを持つことができます。また、caption 要素、thead 要素、tfoot 要素は、1つの table 要素内に 1つしか入れることができません。

なお、レイアウトのために table 要素を使用することは推奨されませんが、もし、テーブルが単にレイアウトのために使用されている場合は、ARIA in HTML 仕様にて定義される role 属性に presentation 値を指定することで、ユーザエージェントに知らせることができます。

table 要素の仕様

コンテンツモデル

下記の順番で

  1. 任意で caption 要素
  2. 0個以上の colgroup 要素
  3. 任意で thead 要素
  4. 0個以上の tbody 要素、または 1つ以上の tr 要素のいずれか
  5. 任意で tfoot 要素
  6. 任意で 1つ以上のスクリプト支援要素と混合される
この要素を使用できる文脈

フロー・コンテンツが期待される場所

この要素で使用できる属性

table 要素のサンプルソース

<table>
 <thead>
  <tr>
   <th>属性</th>
   <th>概要</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>name 属性</td>
   <td>データが送信される際のクエリ名を指定します。</td>
  </tr>
  <tr>
   <td>multiple 属性</td>
   <td>複数の選択肢を選択を可能にします。</td>
  </tr>
 </tbody>
</table>
<table>
 <caption>
  <p><strong>1年1組 生徒名簿</strong></p>
  <p>この表は1年1組の生徒名簿です。列1に出席番号、列2に氏名が入り、生徒1名につき1行となります。</p>
 </caption>
 <thead>
  <tr>
   <th>出席番号</th>
   <th>氏名</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>01</td>
   <td>日本太郎</td>
   …省略…
  </tr>
 </tbody>
</table>

主要ブラウザの対応

IE11
Edge(EdgeHTML)
Edge(Chromium)
Chrome
Firefox
Safari
iOS Safari
Android Chrome

用途から目的の要素を探す

用途から HTML 要素を逆引きできます。