|
 セルの表示位置 スタイルシート |
| ■ text-alignプロパティ |
| text-alighプロパティで、tr、th、th 要素内のインライン内容(テキストや画像など)の水平方向の揃え方を指定する、align属性の代替指定ができます。 |
値
- left (内容を左揃えで表示)
- center (内容を中央揃えで表示)
- right (内容を右揃えで表示)
- justify (均等割付し、テキストを両端揃えで表示 )
|
 ソース |
<table width="120" height="60">
<tr style="text-align : center">
<td style="text-align : right">1972</td>
<td>1973</td>
<td>1974</td>
</tr>
<tr>
<td>1975</td>
<td>1976</td>
<td style="text-align : right">1977</td>
</tr>
</table>
|
|
 表 示 |
|
|
| ■ vertical-alignプロパティ |
| vertical-alignプロパティで、tr、th、th 要素内のインライン内容(テキストや画像など)の上下方向の揃え方を指定する、valign属性の代替指定ができます。 |
値
- top (行中の最も高い内容の上辺に揃える )
- middle (行中の最も高い内容の中央に揃える)
- bottom (行中の最も低い内容の下辺に揃える)
- baseline (先頭行ボックスのベースラインに揃える)
|
 ベースライン baseline |
 |
| 上図の赤いラインを、ベースラインと言います。vertical-alignプロパティの初期値に設定されていますので、特に指定する必要はありません。 |
| ソース |
<table width="120" height="60">
<tr vertical-align : bottom>
<td vertical-align : top>1972</td>
<td>1973</td>
<td>1974</td>
</tr>
<tr>
<td>1975</td>
<td>1976</td>
<td vertical-align : bottom>1977</td>
</tr>
</table>
|
|
| 表 示 |
|
|
vertical-alignプロパティには下記の値も指定できますが、セルに指定した場合は、基本的には、baseline の値を指定した場合と同じ表示になりますが、ブラウザによって表示が異なります。
- super (上付き文字の位置に揃える)
- sub (下付き文字の位置に揃える)
- text-top (親要素の上辺にテキストを揃える)
- text-bottom (親要素の下辺にテキストを揃える)
|
|
|
|
|
|
|
セル内の表示位置