最終更新日 2021年4月7日

caption要素

caption要素は、表のタイトルを示します。caption要素を用い、表のタイトルに加え簡単な説明を記述することで、表の内容がわかりやすくなります。

ただし、table要素がfigure要素内にあり、table要素のほかにfigcaption要素しか含まれていない場合には、表のタイトルはfigcaption要素で示すようにして、caption要素は省略しましょう。

caption要素はtable要素内で最初に記述します。

HTML5での変更点

・align属性は廃止されました。

カテゴリ	タグの省略	親要素	子要素
なし	省略不可	table	Flowコンテンツ（table要素を除く）

属性	値	説明
グローバル属性	-	-
イベント属性	-	-

サンプルコード

<body>
  <table border="1">
    <caption>料金表</caption>
    <tbody>
      <tr>
        <th>商品名</th>
        <th>料金</th>
      </tr>
      <tr>
        <td>ハンバーガー</td>
        <td>100円</td>
      </tr>
      <tr>
        <td>チーズバーガー</td>
        <td>120円</td>
      </tr>
    </tbody>
  </table>
</body>

参考文献：W3C HTML5「4.9.2 The caption element」

当サイトの活動をサポートしてみませんか？気軽にクリエイターの支援ができます。