ホーム

tbody,thead,tfoot

テーブルの領域

機能

  • thead 要素は、表のヘッダー行をグループ化するために使用されます。通常、列の見出しを含む行が配置されます。
  • tbody 要素は、表の本体部分をグループ化するために使用されます。データ行が配置されます。
  • tfoot 要素は、表のフッター行をグループ化するために使用されます。通常、合計や注釈などの情報が含まれます。

よく設定する属性

なし

使い方

HTML ファイルは下記のテンプレートに従い 記載します。

<style>
  thead {
    background-color: #f2f2f2;
  }
  tbody {
    background-color: #ffffff;
  }
  tfoot {
    background-color: #f2f2f2;
    font-weight: bold;
  }
</style>
<table>
  <thead>
    <tr>
      <th>名前</th>
      <th>年齢</th>
      <th>職業</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>山田太郎</td>
      <td>30</td>
      <td>エンジニア</td>
    </tr>
    <tr>
      <td>鈴木花子</td>
      <td>25</td>
      <td>デザイナー</td>
    </tr>
  </tbody>
  <tfoot>
    <tr>
      <td colspan="3">合計: 2人</td>
    </tr>
  </tfoot>
</table>