最終更新日

tr要素

tr要素は、行を表します。tr要素の数に対応して、親要素内に行が作成されます。表の各セルは、tr要素内にtd要素またはth要素を入れて作ります。

tr要素は、thead要素tbody要素tfoot要素それぞれの要素内に記述できます。table要素内にtbody要素が含まれていなければ、table要素内に記述することも可能です。しかし、表の構成をわかりやすくするためには、table要素内に直接、tr要素を記述するべきではないでしょう。

tr要素の終了タグは、直後に別のtr要素があるか、またはtr要素が親要素内の最終コンテンツである場合に省略可能です。

HTML5での変更点
・align、background、bgcolor、char、charoff、valignの各属性は廃止されました。
カテゴリ タグの省略 親要素 子要素
なし 終了タグのみ省略可能 tabletheadtbodytfoot tdth
属性 説明
グローバル属性 - -
イベント属性 - -
サンプルコード
<body>
  <table>
    <caption>料金表</caption>
    <thead>
      <tr>
        <th>商品名</th>
        <th>料金</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>ハンバーガー</td>
        <td>100円</td>
      </tr>
      <tr>
        <td>チーズバーガー</td>
        <td>120円</td>
      </tr>
    </tbody>
  </table>
</body>
参考文献:W3C HTML5「4.9.8 The tr element」外部リンク
HOME