【CSS】フォントの「太さ」を指定する font-weight

スポンサーリンク

CSSフォントの「太さ」を指定するには font-weight プロパティを使用します。

font-weight プロパティは、normal や bold といったキーワードだけでなく、数値で指定することもできます。 指定できる数値の範囲は100, 200, 300, 400, 500, 600, 700, 800, 900 です。 normal が 400 に該当し、bold は 700 に該当します。

使用例


font-weight: normal;  /* 400 と同じ */
font-weight: bold;    /* 700 と同じ */
font-weight: 900;
font-weight: 200;

サンプル

font-weight に normal、bold、各数値を指定してみます。

この font-weight は normal です。

この font-weight は bold です。

この font-weight は 100 です。

この font-weight は 200 です。

この font-weight は 300 です。

この font-weight は 400 です。

この font-weight は 500 です。

この font-weight は 600 です。

この font-weight は 700 です。

この font-weight は 800 です。

この font-weight は 900 です。

役立ちツール

CSS 基本事項

CSS セレクタ

CSS テキスト・フォント

CSS 色・画像・背景

CSS ボックス

トランジション

リスト

テーブル

CSS レイアウト

CSS その他

用語

関連サイト