[返信する]
文字と画像の高さの揃え方
By 夕日
2011-05-22 03:29:55
閲覧ありがとうございます。場所お借り致します。
タイトル通りですが、画像と文字の高さを揃えたいのですが、どうすればよいのでしょうか？
<画像><文字>で入力すると、文字がやや下に揃ってしまいます(アンダーラインに合ってしまうみたいです)。
文字の中心に画像の中心を合わせたいです。
出来れば一々画像タグに入れるのではなく、ページのHEAD・HTML詳細の欄で指定したいです。
｢画像 文字｣等で検索致しましたが、見つかりませんでしたので質問させて頂きました。
もし重複していたら申し訳ございません。
どうぞ宜しくお願い致します。
945SH
[編集]
By たすけあい
2011-05-22 05:02:18
画像の横に表示させる文字は一行でしょうか？
その場合でページ内の画像すべてに一括で指定をご希望でしたら、HEAD内に
<style type="text/css">
img{
vertical-align : middle;
}
</style>
を指定で出来ます。

docomoブラウザ1.0にも対応させたい場合は、imgタグ一つ一つに指定する必要があります。

文字サイズと画像の高さによって、「文字の中央=画像の中央」表示にならない場合がありますから、その場合は文字サイズを追記して調節するか、margin-top:○px;だけで調節します。

ご承知と思いますが、「画像｜文字」の、画像横幅 ＋ 一行の文字数の合計幅がブラウザの横幅表示領域を超えると、携帯の場合は超えた文字が画像下に表示されてしまいます。
携帯向けには画像横幅 ＋ 一行の文字数の合計幅を230px以内にしたほうが無難です。

943SH
[編集]
[1-10表示]
[返信する]
[新規トピ]
[戻る]
無料HPエムペ！