|
|
ブラウザ上で文字の見た目を確認する・その2(cssの文字サイズ指定をpxに変換)
|
|
|
OS、ブラウザによってフォントの解釈がどう変わるか、各フォントのサイズ指定の状態を絶対指定のpxに直して表示します。文字列をクリックするとタイトル部分にpxで表示します。IE9等、ブラウザによっては小数点以下も表示します。
このページの表示: cssで文字サイズ指定、font-family指定無し
font-family指定無し
ブラウザのfont-sizeプロパティの初期値:mediumを想定
Windows IE6 のデフォルト(文字サイズ"中")では約16pxに相当
※このページを利用するには、javascriptが必要です。
|
|
7段階のxx-small~xx-largeで指定(デフォルトサイズに対する相対指定)
pxに変換:・・・
xx-small : Font Size 文字の大きさ(見た目)
|
x-small : Font Size 文字の大きさ(見た目)
|
small : Font Size 文字の大きさ(見た目)
|
medium : Font Size 文字の大きさ(見た目)
|
large : Font Size 文字の大きさ(見た目)
|
x-large : Font Size 文字の大きさ(見た目)
|
xx-large : Font Size 文字の大きさ(見た目)
|
それまでのサイズから相対的にやや大きく・larger、やや小さく・smaller
pxに変換:・・・
medium : Font Size 文字の大きさ(見た目)・それまでのサイズ
|
larger : Font Size 文字の大きさ(見た目)
|
medium : Font Size 文字の大きさ(見た目)・それまでのサイズ
|
smaller : Font Size 文字の大きさ(見た目)
|
emで指定(文字の高さを1としたサイズに対する相対指定)
pxに変換:・・・
0.7em : Font Size 文字の大きさ(見た目)
|
0.8em : Font Size 文字の大きさ(見た目)
|
0.9em : Font Size 文字の大きさ(見た目)
|
1em : Font Size 文字の大きさ(見た目)
|
1.1em : Font Size 文字の大きさ(見た目)
|
1.2em : Font Size 文字の大きさ(見た目)
|
1.3em : Font Size 文字の大きさ(見た目)
|
1.4em : Font Size 文字の大きさ(見た目)
|
%で指定(デフォルトサイズに対する相対指定)
pxに変換:・・・
65% : Font Size 文字の大きさ(見た目)
|
70% : Font Size 文字の大きさ(見た目)
|
75% : Font Size 文字の大きさ(見た目)
|
80% : Font Size 文字の大きさ(見た目)
|
85% : Font Size 文字の大きさ(見た目)
|
90% : Font Size 文字の大きさ(見た目)
|
95% : Font Size 文字の大きさ(見た目)
|
100% : Font Size 文字の大きさ(見た目)
|
105% : Font Size 文字の大きさ(見た目)
|
110% : Font Size 文字の大きさ(見た目)
|
115% : Font Size 文字の大きさ(見た目)
|
120% : Font Size 文字の大きさ(見た目)
|
125% : Font Size 文字の大きさ(見た目)
|
130% : Font Size 文字の大きさ(見た目)
|
135% : Font Size 文字の大きさ(見た目)
|
pt(絶対指定)で指定
pxに変換:・・・
8pt : Font Size 文字の大きさ(見た目)
|
9pt : Font Size 文字の大きさ(見た目)
|
10pt : Font Size 文字の大きさ(見た目)
|
11pt : Font Size 文字の大きさ(見た目)
|
12pt : Font Size 文字の大きさ(見た目)
|
13pt: Font Size 文字の大きさ(見た目)
|
14pt : Font Size 文字の大きさ(見た目)
|
15pt : Font Size 文字の大きさ(見た目)
|
16pt : Font Size 文字の大きさ(見た目)
|
17pt : Font Size 文字の大きさ(見た目)
|
18pt : Font Size 文字の大きさ(見た目)
|
19pt : Font Size 文字の大きさ(見た目)
|
|
|
|
|