Weblasts

表を作るタグたち

いくつか前の記事でリストについて書きましたが、HTMLは表を作るためのタグが用意されています。
この記事では表を作るためのタグを紹介していきます。

<table>タグ

<table>タグは表全体を囲むタグで、このタグで囲まれた範囲は表として認識される。

<tr>タグ

<tr>タグは表の横一行の範囲を決めるタグで(table-rowの略)
<table>タグの直下にしか配置することができません。
中には<th>タグと<td>タグを入れて使いますが、ほかの<tr>タグの中身と同じ数になるようにマークアップする必要があります。
<tr>タグの中には<th>タグか<td>タグしか入れることができないので注意が必要。

<th>タグ

<th>タグはデータの見出しを示すタグ(table-headerの略)
このタグで囲まれた文字列はデフォルトの状態で太字になり、中央揃えされる。

<td>タグ

<td>タグは個別のデータを示すタグ(table-dataの略)
このタグで囲んでも見た目は特別変化しません。

HTML

<table>
  <tr>
    <th>表の見出し</th>
    <td>表のデータ</td>
  </tr>
</table>

他にも表の中で使えるタグがありますが、ひとまずは表を作るために必要なタグだけを覚えましょう

Recommend Post