表に見出しをつけよう
● 表の見出しをつけてみよう！
表の見出しをつけてみましょう
<td> </td>の代わりに <th> </th>を指定することでセルの行や列に見出しをつけることができます
<th> で指定されたセルのテキストは 中央揃えで太字になります
<table width="400" border="1">
<tr>
<th>
月曜日 </th><th>
火曜日 </th><th>
水曜日 </th><th>
木曜日 </th>
</tr>
<tr>
<td>田中</td><td>加藤</td><td>鈴木</td><td>藤田</td>
</tr>
</table>
すると 下のようになります
| 月曜日 | 火曜日 | 水曜日 | 木曜日 |
|---|---|---|---|
|
田中
|
加藤 | 鈴木 | 藤田 |
今度は この表を縦にしてみます
<table width="180" border="1">
<tr>
<th> 月曜日 </th> <td>田中</td>
</tr>
<tr>
<th> 火曜日 </th> <td>加藤</td>
</tr>
<tr>
<th> 水曜日 </th> <td>鈴木</td>
</tr>
<tr>
<th> 木曜日 </th> <td>藤田</td>
</tr>
</table>
<tr>
<th> 月曜日 </th> <td>田中</td>
</tr>
<tr>
<th> 火曜日 </th> <td>加藤</td>
</tr>
<tr>
<th> 水曜日 </th> <td>鈴木</td>
</tr>
<tr>
<th> 木曜日 </th> <td>藤田</td>
</tr>
</table>
すると 下のようになります
| 月曜日 | 田中 |
|---|---|
| 火曜日 | 加藤 |
| 水曜日 | 鈴木 |
| 木曜日 | 藤田 |
<th> </th>で指定してあるところが 中央揃えで太字になっていることがわかりますね
© Rakuten Group, Inc.
