CSSでフォントを変えてブログの見た目をグッと良くしよう

こんにちわ、ついついコンビニスイーツでどら焼きを買ってしまう和スイーツに目がないゆずのすけです。まずい訳がないのだ！

皆さんブログを書いてますか？ホームページ持ってますか？
サイトを装飾するフォントって大事ですよね、お気に入りのフォントで装飾するだけで、全く別のサイトのように感じるし嬉しい気持ちになれるものです。

そこで今回は

を解説していきます。

font-familyプロパティとは？

font-familyプロパティはCSSのプロパティのひとつで、CSSプロパティには’width’や’border’、’background’などがあります。
その中でも、font-familyはCSSの文字フォントを何にするのか指定する時に使用するプロパティになります。

font-familyプロパティの使い方

font-familyの使い方は簡単で

と書きます。
書く場所に決まりはないですが、bodyタグに書く事でWEBサイト全体に指定することが出来るのでおすすめです。

フォントファミリー名の書き方にはルールがあり、フォントファミリー名は全角、半角、スペースを含み正しく記述しなければなりません。

またフォントにスペースがある場合はダブルクォーテーション（”　”）もしくはシングルクォーテーション（’　’）で囲みます。

そして、font-familyはブラウザーそれぞれや状況で対応できるフォントが異なるため複数指定する事が推奨されています。
複数指定した場合、左に書いたフォントファミリーから優先されます。

例

総称ファミリーフォント

フォントファミリーを複数指定したものの、どれもがブラウザに対応してなかったという時があります、そんな時の為に指定出来る総称フォントファミリーというモノが存在します。

総称フォントファミリーは所謂最後の壁になりますので、一番最後に記述してあげるといいです。

総称フォントファミリーには、色々な種類があります。

例１

例２

例３

などなど色んな書き方がありますが、無難なところで言いますと例１の書き方が私のおすすめです。

まとめ

さて、いかがだったでしょうか？
是非今回学んだ事を活かして、自身のWEBサイトや自作アプリなどのフォントをいいモノに変えていってくださいね。
この記事があなたの役に立てば幸いです。