総称ファミリ一覧とCSSでのフォント指定方法

この記事のカテゴリ
WEBサイト運営 / 各種コード
この記事に付けられたタグ

CSSでフォントを指定していても、見ているパソコンにそのフォントがなければ、望みどおりの表示をする事が出来ません。

なのでフォントを指定する場合は、第一候補・第二候補…という用に表示希望順にフォントを指定します。

フォント名にスペースがある場合はシングルクォーテーションで囲みます(ダブルクォーテーションでも間違ってはないのですがシングルを使ったほうがいいです)。

そして、最後の指定にはWindowsにもMacにも確実に表示がされるように総称ファミリを指定します。

総称ファミリはOSに標準で搭載されているフォントのことで、これを指定しておけばサイトを表示する際にブラウザが「どのフォントを表示していいかわからない」状態を防げます。

CSSはこのようにしてフォントを指定します。

最初に任意のフォント、最後に総称ファミリを指定
font-family:'MS PGothic', Osaka, 'MS Gothic', sans-serif;

先に書いた順に優先され、1番前に書いたフォントが無い場合は2番目3番目…となります。

最後に指定する総称ファミリは以下の5つです。
総称ファミリは「一般フォントファミリ」「ジェネリックフォントファミリ(generic font family)」とも呼ばれています。

総称ファミリ名 字体
serif 明朝体
sans-serif ゴシック体
cursive 筆記体
fantasy 装飾体
monospace 等幅
LINEで送る
Pocket

関連記事

コメントを書き込む

コメントは承認後に公開されます。メールアドレスは公開されません。
*」は必須項目です。