セル内の文字の位置を指定する
■<td align="キーワード1" valign="キーワード2">〜</td>など
キーワード1にはleft、center、rightのいずれかを指定
キーワード2にはtop、middle、bottomのいずれかを指定
キーワード1にはleft、center、rightのいずれかを指定
キーワード2にはtop、middle、bottomのいずれかを指定
セル内の文字の位置を指定するには、align属性とvalign属性を使います。align属性は段落を指定する<p >タグや、線を表示する<hr >タグのページで説明していますが、同じように横の位置を、左(left)や中央(center)そして右(right)に指定することができます。
valign属性はここで初めて出てきましたが、この属性を使えば縦の位置を上(top)や中央(middle)そして下(bottom)に指定することができます。この二つの属性を指定しない場合、<tr >タグと<td >タグは、align="left" valign="middle"とされるので、左揃えで縦の位置が中央にセル内の文字が表示されます。
<th >タグの場合はセンタリングされるので、何も指定しない場合、align="center" valign="middle"となります。それと<tr>タグにalign属性とvalign属性を使って位置を指定すれば、その行のセル全体を、同じ位置にすることができます。
align属性とvalign属性は廃止されてますので、CSSのtext-alignプロパティとvertical-alignプロパティを使うようにしましょう。
サンプル - Microsoft Internet Explorer | |||||||||
|
HTML
<table border="1" width="230" height="230">
<tr>
<td algin="left" valign="top">(1)</td>
<td align="center" valign="top">(2)</td>
<td align="right" valign="top">(3)</td>
</tr>
<tr>
<td align="left" valign="middle">(4)</td>
<td align="center" valign="middle">(5)</td>
<td align="right" valign="middle">(6)</td>
</tr>
<tr>
<td align="left" valign="bottom">(7)</td>
<td align="center" valign="bottom">(8)</td>
<td align="right" valign="bottom">(9)</td>
</tr>
</table>