<table width="数字" height="数字">でテーブルの横幅と高さを 指定できます。<td>と<th>も同様の指定が出来ます。

■ テーブル全体、セルの横幅、高さを指定する

【ブラウザ表示】

<table border="1" width="100" height="100">
<tr>
<td width="50">横の長さ50</td><td width="50">横の長さ50</td>
</tr>
</table>

■ 1段のみ横幅もしくは高さを指定する

【ブラウザ表示】

<table border="1" width="400" height="150">
<tr>
<td width="150">横150×縦100</td><td>横250×縦100</td>
</tr>
<tr>
<td height="50">横150×縦50</td><td>横250×縦50</td>
</tr>
</table>

■ テーブル全体、セルの横幅、高さを%で指定

width="%"で指定した場合、テーブルの横幅は画面全体100%に対する割合 の長さになります。 テーブルの横幅が50%だと画面全体の2分の1、つまり半分の大きさということ になります。

テーブルの横幅と高さを指定してある時でセルの横幅、高さを%で指定した場合、 それらの大きさはテーブル全体に対する割合の大きさになります。

2列×2行のテーブル全体の横幅、高さが200ピクセルでセルの横幅、高さが50%の場合、 各セルの横幅、高さは、200×50％＝100ピクセルということになります。 横幅や高さを 指定しない場合はセル内の文字の長さに応じて自動拡張します。

【ブラウザ表示】

<table border="1" width="200" height="200">
<tr>
<td width="50%" height="50%">横50%×縦50%</td>
<td width="50%" height="50%">横50%×縦50%</td>
</tr>
<tr>
<td width="50%" height="50%">横50%×縦50%</td>
<td width="50%" height="50%">横50%×縦50%</td>
</tr>
</table>

<table width="数字">や<td width="数字">を指定している場合、セル内の文字 や文章は指定された横幅の端までくると折り返し自動的に次の行に改行されます。 もし自動改行させたくない場合は<td nowrap> とするか<table width="数字">と<td width="数字">を両方とも 指定しない、のどちらかでOKです。

Follow @hp_master_2003

■ その他の項目

HTMLタグ一覧のページに戻る