表を作るタグたち
いくつか前の記事でリストについて書きましたが、HTMLは表を作るためのタグが用意されています。
この記事では表を作るためのタグを紹介していきます。
<table>タグ
<table>タグは表全体を囲むタグで、このタグで囲まれた範囲は表として認識される。
<tr>タグ
<tr>タグは表の横一行の範囲を決めるタグで(table-rowの略)
<table>タグの直下にしか配置することができません。
中には<th>タグと<td>タグを入れて使いますが、ほかの<tr>タグの中身と同じ数になるようにマークアップする必要があります。
<tr>タグの中には<th>タグか<td>タグしか入れることができないので注意が必要。
<th>タグ
<th>タグはデータの見出しを示すタグ(table-headerの略)
このタグで囲まれた文字列はデフォルトの状態で太字になり、中央揃えされる。
<td>タグ
<td>タグは個別のデータを示すタグ(table-dataの略)
このタグで囲んでも見た目は特別変化しません。
|
1 2 3 4 5 6 |
<table> <tr> <th>表の見出し</th> <td>表のデータ</td> </tr> </table> |
他にも表の中で使えるタグがありますが、ひとまずは表を作るために必要なタグだけを覚えましょう
