HTML STUDY

font-familyの書体一覧

ここではCSSプロパティfont-familyで指定できるフォントの書体一覧について解説していきます。フォントの書体には大きく5つの種類があります。

font-familyの5つの種類

フォントの5つの種類には以下のようなものがあります。またfont-familyに与える値としてフォント名にスペースがある場合引用符(")で囲む必要があります。また閲覧している側に指定したフォントがなかった場合に備えて複数のフォントを(,)で区切って与えることもできます。

CSSプロパティ解説
font-familyフォントの種類
font-familyの種類解説
serif飾りつきのフォント
sans-serif飾りなしのフォント
monospace等幅のフォント
fantasy装飾的なフォント
cursive筆記体のフォント

各種類の書体サンプルは以下のようになります。

serif
指定なしあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
serifあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Century"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Estrangelo Edessa"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Gungsuh"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Shruti"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
sans-serif
指定なしあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
sans-serifあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Arial"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Arial Black"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Impact"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Century Gothic"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
monospace
指定なしあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
monospaceあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"HG行書体"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"MS ゴシック"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"MS 明朝"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"BatangChe"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
fantasy
指定なしあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
fantasyあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Modern"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Monotype Corsiva"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
cursive
指定なしあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
cursiveあいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"HGP行書体"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"HG正楷書体-PRO"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Comic Sans MS"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789
"Script"あいうえお 春夏秋冬
ABCDEFG abcdefg
0123456789

CSS文字 関連記事