CSS - font-size-adjust

トップ > CSSリファレンス > font-size-adjust

概要

属性名 font-size-adjust
<number> | none
初期値none
適用可能要素すべての要素
継承継承する
メディアVisual / Font
サポートC2.0 / Fx3

サポート (説明)

CSSIE/EdgeFirefoxChromeOperaSafari
CSS2(未)3(未)(未)(未)

説明

フォントの x-height(フォントサイズに対する文字 x の割合)を指定します。CSS2.0 で定義されましたが、CSS2.1 では破棄されました。CSS3 で再定義される予定です。

説明
<number>x-height を 0.48 のような数値で指定します。
nonex-height を指定しません。

fontfont-family で複数の英文フォント候補を指定する場合、表示されるフォントによって、見かけ上のフォントの大きさが異なることがあります。これは、フォントサイズが同じでも、フォントサイズに対する文字 x の高さの割合(x-height)が異なるためです。下記は、同じ 24pt のフォントですが、Arial の方が x-height が大きいため、Times よりも大きく見えます。

size:24pt
TimesArial
x-name x-name

この問題を解消するため、フォントサイズの代わりに x-height を指定することにより、選択されるフォントが変わっても、同じ x-height の文字を表示することが可能になります。現時点では、Firefox がこの機能をサポートしています。

size:24pt + adjust:0.45
TimesArial
x-name x-name

使用例

Firefox 最新版で見てください。

HTML
<h5>none</h5>
<div>
  <span style="font:24pt Times; font-size-adjust:none">x-name</span>
  <span style="font:24pt Arial; font-size-adjust:none">x-name</span>
</div>
<h5>font-size-adjust</h5>
<div>
  <span style="font:24pt Times; font-size-adjust:0.45">x-name</span>
  <span style="font:24pt Arial; font-size-adjust:0.45">x-name</span>
</div>
表示
none
x-name x-name
font-size-adjust
x-name x-name

リンク


Copyright (C) 1997-2016 杜甫々
初版:1997年7月27日、最終更新:2016年7月24日
http://www.tohoho-web.com/css/prop/font-size-adjust.htm