HTML テーブルのサイズ
HTMLテーブルは、列、行、またはテーブル全体で異なるサイズを持つ事ができます。
表、行、列のサイズを指定するにはstyle属性とwidthまたはheightプロパティを使用します。
HTMLテーブルの幅
テーブル幅を設定するには、<table>要素にstyle属性を追加します。
例
表の幅を100%に設定します。
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
注：幅のサイズ単位としてパーセンテージを使用すると、この要素がその親要素 (この場合は<body>要素）と比較してどれくらいの幅になるのかを意味します。
HTMLテーブルの列幅
特定の列のサイズを設定するには、<th>または<td>要素にstyle属性を追加します。
例
最初の列の幅を70%に設定します。
<table style="width:100%">
<tr>
<th style="width:70%">Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
HTMLテーブルの行の高さ
特定の行の高さを設定するには、表の行要素にstyle属性を追加します。
例
2行目の高さを200ピクセルに設定します。
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr style="height:200px">
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。