CSS - フォントサイズを指定する font-size

CSS でフォントサイズ（大きさ）を指定するには、font-size プロパティを使用します。

値の指定方法

font-size の値の指定方法は次の4通りです。

• 実数値 + 単位
• パーセント + %
• larger、smaller
• xx-small、x-small、small、medium、large、x-large、xx-large

実数値 + 単位

実数値に単位をつけてサイズを指定。(例: 15px、1.2em）

パーセント値 + %

親要素のフォントサイズに対するパーセント値でサイズを指定。 （例: 120%、90%）

larger、smaller

親要素のフォントサイズに対する相対サイズで指定。 「larger」は一回り大きいサイズ、「smaller」は一回り小さいサイズ。

xx-small、x-small、small、medium、large、x-large、xx-large

7段階の絶対サイズとされていますが、実際の表示はブラウザにより違いがあります。 xx-small が最も小さく、xx-large が最も大きいサイズ。

フォントサイズ指定のサンプル

★ フォントサイズは「100%」です。

★ フォントサイズは「120%」です。

★ フォントサイズは「80%」です。

★ フォントサイズは「15px」です。

★ フォントサイズは「15pt」です。

★ フォントサイズは「larger」です。

★ フォントサイズは「smaller」です。

★ フォントサイズは「x-small」です。

★ フォントサイズは「small」です。

★ フォントサイズは「medium」です。

★ フォントサイズは「large」です。

★ フォントサイズは「x-large」です。

まとめ

フォントサイズ（大きさ）を指定するには、font-size プロパティを使用します。

値の指定方法は4種類ありますが、 その中でも「実数値 + 単位」と「パーセント値 + %」がよく使われます。