|
|
 |
| ■ これだけで十分！！ |
セル内の文字・画像の表示位置。
次のテーブルを基本にして説明します。
<table border>
<tr>
<td width="100" height="50">セル1-1</td>
<td width="100" height="50">セル1-2</td>
<td width="100" height="50">セル1-3</td>
</tr>
</table>
|
align="" セル内の文字・画像の横の位置を変えます
align="left" で左に寄せる。
align="center" 中央に位置する。
align="right" 右に寄せる
<table border>
<tr>
<td width="100" height="50" align="left">セル1-1</td>
<td width="100" height="50" align="center">セル1-2</td>
<td width="100" height="50" align="right">セル1-3</td>
</tr>
</table>
|
valign="" セル内の文字・画像の縦の位置を変えます
valign="top" 上そろえ
valign="middle" 中央に位置する。
valign="bottom" 下そろえ
<table border>
<tr>
<td width="100" height="50" valign="top" >セル1-1</td>
<td width="100" height="50" valign="middle">セル1-2</td>
<td width="100" height="50" valign="bottom">セル1-3</td>
</tr>
</table>
|
valign=""とalign=""は組み合わせて使うことも出来ます。
<table border>
<tr>
<td width="100" height="50" valign="top" align="left">セル1-1</td>
<td width="100" height="50" valign="middle" align="center">セル1-2</td>
<td width="100" height="50" valign="bottom" align="right">セル1-3</td>
</tr>
</table>
|
cellspacing セル同士の間隔を指定
cellspacing="0"のテーブル
<table border cellspacing="0">
<tr>
<td>セル1-1</td>
</tr>
<tr>
<td>セル1-2</td>
</tr>
</table>
cellspacing="10"のテーブル
<table border cellspacing="10">
<tr>
<td>セル1-1</td>
</tr>
<tr>
<td>セル1-2</td>
</tr>
</table>
|
cellpadding="" セルの余白を指定
cellpadding="0"のテーブル
<table border cellpadding="0">
<tr>
<td>セル1-1</td>
</tr>
<tr>
<td>セル1-2</td>
</tr>
</table>
cellpadding="10"のテーブル
<table border cellpadding="10">
<tr>
<td>セル1-1</td>
</tr>
<tr>
<td>セル1-2</td>
</tr>
</table>
|
←戻る
←メニュー
△△ページトップへ△△
|
