文字の垂直位置 【vertical-align】
ブラウザで表示した時の見え方
撮影者：あい
ソースサンプル（HTML)
【CSS】
.middle {
vertical-align: middle
}
【HTML】
<img src="./img/rose.gif" alt="薔薇" class="middle">
撮影者：あい
ソースサンプル（XHTML)
【CSS】
.middle {
vertical-align: middle
}
【HTML】
<img src="./img/rose.gif" alt="薔薇" class="middle" />
撮影者：あい
[
黒※説明中のタグ
紫※省略可能なタグ
赤※変更可能
緑※文章など
]
解説
- vertical-align属性は、縦方向の位置を指定するため、<em>、<a>、<img>などのインライン要素のみに設定できます。
- sub、superはIE４以降、NN6で対応しています。
| オプション |
| baseline | 文字をベースラインに配置する | vertical-align: baseline |
| super | 文字を上付きする | vertical-align: super |
| sub | 文字を下付きにする | vertical-align: sub |
| top | セル内の文字を上揃えにする | vertical-align: top |
| middle | セル内の文字を中央揃えにする | vertical-align: middle |
| bottom | セル内の文字を下揃えにする | vertical-align: bottom |
| 値 | 機能 | 例 |
AICHAN WEB(Z)
>
HTML＆CSSサンプル集(S)
>
CSS
-
文字の垂直位置