ヘッダー・コニファロゴお問い合わせ営業日カレンダーサイトマップコニファHOME
ブラウザ上で文字の見た目を確認する・その2(cssの文字サイズ指定をpxに変換)

ブラウザ上で文字の見た目を確認する・その2
(cssの文字サイズ指定をpxに変換)

ブラウザ上で文字の見た目確認する・その1(cssで文字サイズ指定・サンプル)へ
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 文字の大きさ(見た目)



ツール集TOPへ



 

戻るボタン
Copyright© 2019 Conifer,Inc. All rights reserved.