font-familyに記述する順番って何か関係あるの？と思ったので調べてみた。

font-familyに記述する順番って何か関係あるの？と思ったので調べてみた。

こんにちは、Web制作をしているOuiです。
いつもWeb勉強中です。
今回はふとあれ？と思ったCSSの記述の勉強し直し。

font-familyの記述の順番の意味について

学校で習った時、font-familyを丸暗記してしまいました。
改めて、font-familyの順番の意味について調べた次第です。

前に行くほど優先順位が高い

font-familyで指定したフォント。
最初に指定したフォントの種類が、より優先して表示される。
使いたいフォントを、最初に記述すること。

Tips

アルファベットを指定しておきたい場合
＝英語フォントを、日本語フォントより先に指定しておく

Tips2

sans-serifの意味とは
指定したフォントがブラウザにない場合、使用される最低限のフォント。
sans-serif＝ゴシック体
serif＝明朝体
など。

個人的に好きなfont-family

・游ゴシック
・游明朝

まとめ

現在、メイリオ、ヒラギノ角ゴシックProNを使っているサイトが多い。
フォントにこだわることで、差別化出来る。
サイトの印象も、おしゃれに変わったりする。

参考にしたサイト

小粋空間さん
http://www.koikikukan.com/archives/2012/08/13-023456.php

HTMLクイックリファレンス
http://www.htmq.com/style/font-family.shtml

サルワカさん
https://saruwakakun.com/html-css/basic/font-family-how-to

MDN
https://developer.mozilla.org/ja/docs/Web/CSS/font-family

WPJ
https://www.webprofessional.jp/20-inspirational-free-resources-for-better-typeface-pairing-2/

好きなフォントのサイト

cocoda!
https://www.cocoda-design.com/

神保真珠商店
http://jinbo-pearls.jp/

yutori
http://yutori.tokyo/