フォントの違いによるサイズの調整を行なう
Last update: 2008-08-18
Firefox は font-size-adjust をサポートしているのだが、これが利用できたのは Windows 環境での話で、Firefox 3 になって全てのプラットフォームで利用可能となった。
欧文の文章では小文字が主体となるのだが、この時の見目や読みやすさといった印象は、フォントサイズよりも小文字 x の高さを示す x-height 値に、より左右される。これはフォントの種類によって異なり、フォントサイズは同じでも見目や読みやすさは異なることになる。
例えば、指定したフォントが使用できなかった場合の代替えフォントを表示した際に、この印象問題が予想される場合は、font-size-adjust に値を指定して、見た目の相違を調整する。このような使い方をするためのプロパティだ。
font-size-adjust プロパティには「アスベクト値」を指定する。これはフォントサイズを x-height で割って求める。アスベクト値の詳しい情報は W3C の CSS 3 Working Draft font-size-adjust より得られる。
レンダリングサンプル
- 重要：
- このレンダリングサンプルは Firefox 3 以外のブラウザでは結果を確認できません。
下のサンプルは font-size 1em を指定したパラグラフに、上は Verdana を、下２つは Times New Roman を指定している。
さらに最下段のパラグラフには font-size-adjust: .54; を加えてサイズ調整を行なった。
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
The quick brown fox jumps over the lazy dog
上と下では、ほぼ同じくらいのサイズで見えるはずだ。一方 font-size-adjust を指定していない中のパラグラフは、同じサイズとは思えないほど小さく感じる。
このプロパティが指定できるのは全ての要素だが、font-size-adjust が有効になるのは欧文フォントで、和文フォントは利用できない。さらに、2008 年 8 月 19 日現在、font-size-adjust に対応しているのは Gecko 系ブラウザのみ、それも全プラットフォームで対応しているのは Firefox 3.0 以上だ。
ということで、これはハッキリ言って日本語環境の HTML で使われることはほとんどないと思う。
