テーブル

目次
  • thead
  • tfoot
  • tbody
  • caption
  • colgroup … 複数のcolをまとめる
  • col
caption
header 1 header 2
footer 1 footer 2
data data
<table border="1">
    <caption>caption</caption>
    <col />
    <thead>
      <tr>
          <th>header 1</th>
          <th>header 2</th>
      </tr>
    </thead>
    <tfoot>
      <tr>
        <td>footer 1</td>
        <td>footer 2</td>
      </tr>
    </tfoot>
    <tbody>
      <tr>
          <td>data</td>
          <td>data</td>
      </tr>
    </tbody>
</table>

配置の要件

  • thead、tfoot、tbodyは省略可能。ただしいずれかを用いる場合、ヘッダ部、フッタ部、ボディ部が存在するならば、それらも対応する要素で囲む。
  • thead、tfoot、tbodyを記述する場合は、この順とする。
thead 要素 - HTML | MDN tfoot 要素 - HTML | MDN tbody 要素 - HTML | MDN

レンダリングの高速化

可能ならばtable-layoutで固定レイアウトとすることで、レンダリングが高速化されることがあります。

HTMLの情報サイトから、まとめて検索