文字サイズの表記と大きさ

文字サイズの指示タイプ

文字のサイズ指定には様々な方法がある。
ついつい忘れてpx指定ばかりになるとページによってバラつきが出て統一感がなくなる事も…。
実際のサイズを見るためにも備忘録としてまとめる。

文字サイズの記載方法

CSSでの指示と呼出し(外部CSSファイル size.css に記載した場合)

文字サイズの指示は以下の方法がある。

• 〇〇px：モニタの最小単位。モニタによって表示されるサイズが変わる。（高解像度のディスプレイでは小さく表示される）
• 〇〇em：相対的にサイズを決める方法。サイズ指定無しのフォントの大きさを 1em として、数値を小さくすれば縮小、大きくすれば拡大表記になる。
• 〇〇ex：欧文の小文字のxの高さを基準(1ex)として、相対的にサイズを決める方法。em同様に1よりも大きいか否かで拡大縮小を行う。
• 〇〇%：emに似たして方法でサイズ指定無しのフォントの大きさを100％として倍率で大きさを指示する。
• xx-small：相対的にフォントを一回り小さくする。<font size=”-3″>と同じ。
• x-small：相対的にフォントを一回り小さくする。<font size=”-2″>と同じ。
• small：相対的にフォントを一回り小さくする。<font size=”-1″>と同じ。
• medium：相対的にフォントを基準サイズにする。
• large：相対的にフォントを一回り小さくする。<font size=”+1″>と同じ。
• x-large：相対的にフォントを一回り小さくする。<font size=”+2″>と同じ。
• xx-large：相対的にフォントを一回り小さくする。<font size=”+3″>と同じ。

実際に大きさを比べてみる