vertical-align

Home>CSS>プロパティリファレンス>vertical-align

この情報はお役に立ちましたか?よろしければ皆様にもお知らせください。

  このエントリーをはてなブックマークに追加 mixiチェック  

vertical-alignプロパティの役割

vertical-alignプロパティは、行における縦方向の位置を指定します。

vertical-alignプロパティに設定できる値

インライン要素 セル要素
baseline 指定した要素のベースラインに揃える。 ベースラインを最初の行のベースラインに揃える。
bottom 指定した要素の下辺に揃える。 セルの下線を最初の行の下線に揃える。
middle 指定した要素のベースラインから親要素のフォントの大きさの小文字のxの高さの上半分の位置に揃える。 セルの中心線を最初の行の中心線に揃える。
sub 指定した要素のベースラインを親要素の下付き文字の位置に揃える。 baselineが適用される。
super 指定した要素のベースラインを親要素の上付き文字の位置に揃える。 baselineが適用される。
text-bottom 指定した要素の下辺を親要素のフォントの下辺に揃える。 baselineが適用される。
text-top 指定した要素の上辺を親要素のフォントの上辺に揃える。 baselineが適用される。
top 指定した要素の上辺を行中の最も高い要素の上辺に揃える。 セルの上線を最初の行の上線に揃える。

インライン要素とセル要素で、値の解釈が変わります。

vertical-alignプロパティの使い方

<table>
<tr>
<td style="vertical-align:bottom"><img src="../../../data/img/global/logo.jpg" />
テキストの位置が下になる</td>
</tr></table>

テキストの位置が下になる

上のサンプルでは、vertical-alignプロパティをtd要素に設定しました。

関連リンク

よく読まれている記事

UpDate:2010-10-21