Verdanaとメイリオの併用（CSS）

質問

通常メイリオを使用していますが、英数字のみVerdanaにしたくCSSを次のようにしました。

font-family: Verdana,"メイリオ";

すると意図した動作になったのですが、行間がつまってしまいました。
何故なのでしょうか？

環境はWindows７、Chrome11.0.696.65です。

回答No.4

naokita

行間というより、正しくは「行の高さ」ですが、
line-height: 150%; よりも子要素を考慮し、
line-height: 1.5; のほうが良い場合が多いでしょう。

------------------------

フォントの差異ですが、
そんなに、きめ細かなプロ並みの設定が必要ですか？
（NO.2さん下部のように細かいセレクタ設定でも可能ですがソースが増えますよね）
でなければ、
メイリオの半角英数は、Verdanaベースで作られたので、
単独で見た目の差はほとんど無いですよ。（比較でわかる程度）
それならわざわざ、
半角英数の為にVerdanaを設定するよりも
font-family: "メイリオ";
Verdana抜きで良いのでは？　（文章単位で比較してみましょう！）
非メイリオ環境でもVerdana表示をさせたいって事でしょうか？・・・

但、非メイリオ環境や
メイリオ類似なら他の環境を考慮して、下記とかのような感じになるのかな？
font-family: Verdana, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka,"ＭＳ Ｐゴシック", sans-serif; line-height: 1.5;

CSS font-familyは、環境によって相互関係が非共通なので、
万人の環境で共通に表示させるのは難しいですね・・・

お礼

ありがとうございます。
今回、ディスプレイ向けの「Verdana」を知ったので、使ってみようかと実験していました。
たしかに無理やり使う必要は無いかと感じはじめていますが、行間が変わって見えてしまう理由は理解しておきたいと思っています。

＞CSS font-familyは、環境によって相互関係が非共通なので、
万人の環境で共通に表示させるのは難しいですね・・・
ネットで調べていたのですが、みなさん苦労されているのですね(^^;