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 | 等幅 |