CSS | IE/Edge | Firefox | Chrome | Opera | Safari |
---|---|---|---|---|---|
CSS2 | (未) | 3 | (未) | (未) | (未) |
フォントの x-height(フォントサイズに対する文字 x の割合)を指定します。CSS2.0 で定義されましたが、CSS2.1 では破棄されました。CSS3 で再定義される予定です。
値 | 説明 |
---|---|
<number> | x-height を 0.48 のような数値で指定します。 |
none | x-height を指定しません。 |
font や font-family で複数の英文フォント候補を指定する場合、表示されるフォントによって、見かけ上のフォントの大きさが異なることがあります。これは、フォントサイズが同じでも、フォントサイズに対する文字 x の高さの割合(x-height)が異なるためです。下記は、同じ 24pt のフォントですが、Arial の方が x-height が大きいため、Times よりも大きく見えます。
size:24pt | |
---|---|
Times | Arial |
x-name | x-name |
この問題を解消するため、フォントサイズの代わりに x-height を指定することにより、選択されるフォントが変わっても、同じ x-height の文字を表示することが可能になります。現時点では、Firefox がこの機能をサポートしています。
size:24pt + adjust:0.45 | |
---|---|
Times | Arial |
x-name | x-name |
Firefox 最新版で見てください。
<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>