フォントを指定する場合は総称ファミリーも指定する

Pocket

PhpStormで、CSSを編集していたら、次のような警告が表示されました。

font-property-font-family-has-to-specify-generic-default-01

Font property font-family does not have generic default
This inspection verifies that the CSS font-family property contains a generic font name as a fallback alternative.

Google 翻訳によると、以下の通りです。

Fontプロパティのフォントファミリは、一般的なデフォルトを持っていません
この検査では、CSSのfont-familyプロパティは、フォールバックの代替として汎用フォント名が含まれていることを検証します。

font-familyプロパティを指定する場合は、総称ファミリーを指定しておくのが、お作法というわけですね。具体的には、次のものになります。

総称ファミリー名 フォント
serif 明朝体
sans-serif ゴシック体
cursive 草書体・筆記体
fantasy ファンタジー体(装飾フォント等)
monospace 等幅

総称ファミリーを指定しておけば、任意指定したフォントが閲覧者の環境にインストールされていない場合に、フォールバックとして機能するようになります。以下のように指定しておけば良いでしょう。

Pocket