2019.11.22 2019.11.25

【font-weight / font-style / font-variant】フォントの設定

みいと

Contents

【font-weight】フォントの太さ設定

font-weightプロパティはフォントの太さを設定するプロパティです。
下記の値、キーワードで設定します。(初期値はnormal)

bold	太字(↓の700と同じ)
100, 200, 300, 400, 500, 600, 700, 800, 900	100〜900の9段階指定。 400が標準の太さで数字が大きいほど太くなります。例)100, 200, 300,400, 500, 600, 700, 800, 900 ちょっと変化がわかりにくいですね(;^ω^)
bolder	現在よりも１段階太くします。
lighter	現在よりも１段階補足します。
normal	標準の太さにします。(400と同じ)

font-styleプロパティはイタリックまたは斜体を設定するプロパティです。
下記のキーワードで設定します。(初期値はnormal)

italic	イタリック体で表示されます。例）italic
oblique	斜体で表示されます。斜体がない場合は標準のフォントを斜めにして表示します。例）oblique
normal	標準のフォントで表示されます。例）normal

font-variantプロパティはスモール・キャピタルを設定するプロパティです。

small-caps	大文字を小さくしたようなフォントで表示されます。例）font-variant:small-caps
normal	標準のフォントで表示されます。例）font-variant:normal