CSS:font-familyで基本書体の指定
公開日:2019年12月15日
body {
font-family:
-apple-system,
BlinkMacSystemFont,
"Helvetica Neue",
Meiryo,
"Yu Gothic",
YuGothic,
sans-serif;
}
ページ全体の書体を指定する際は「body」セレクタを使用する
英字から指定する
-apple-system: Mac 「Safari」用の英字フォント 「San Francisco」
BlinkMacSystemFont: Mac 「Chrome」「Opera」用の英字フォント 「San Francisco」
Helvetica Neue: Mac 「その他ブラウザ」用の英字フォント
日本語の指定
Meiryo:Windows用の日本語フォント「メイリオ」
※Windows の見やすさを優先させる際の選択
Yu Gothic:Windows用の日本語フォント「游ゴシック」
※MacとWindows で書体を統一する際の選択
YuGothic:Mac用の日本語フォント「游ゴシック体」
対象書体がない時の書体キーワード
sans-serif:上記書体がない場合にOS内に存在するゴシック体を自動選択させる
※iOS6 以降 iPhone の標準書体は明朝なので注意
同じカテゴリーのコンテンツ