CSS フォントの指定・変更 font-family

こんんちは。レモンティーです。

今回は、フォントの変更や指定です。

使うのはfont-familyプロパティです。

使うとこんな感じです。

↑は
HTML

<p class="sample">使うとこんな感じです。</p>

CSS

.sample{font-family:serif; }

となっています。

字体は

sans-serif ゴシック系

serif 明朝系

cursive 筆記系(一部日本語には反映されません)

fantasy 装飾系(上に同じ)

monospace 等幅系

などから選べます。

ただし、これらが指定しているのはおおまかな分類で、
○○系のうちどれになるかは指定していないので
環境によって違うフォントになります

はっきり指定するには値にフォント名を設定します。
例えば

font-family:"游ゴシック";

とすれば

「游ゴシックで見えるでしょうか」

このように表示されます。

しかし、閲覧者のパソコンに指定したフォントが無かった場合は
ブラウザのデフォルトのフォントで表示されてしまいます。

そのためそれに備えていくつか候補を設定しておくのが普通です

font-family:'ヒラギノ角ゴ ProN W3', メイリオ, 'MS PGothic', arial, sans-serif;

この場合はいろいろ列挙されている上、
どれも無かった場合にsans-serifになります(゜゜;)

ちなみにこのブログのタイトル↓のボタンはCursiveにしてあるのですが
みなさんには全く違ってみえているかもしれませんね。
私の環境ではこう↓です
f:id:sawalemontea:20171124112545p:plain




今回はこれでおしまいです
sawalemounity.hatenablog.com

sawalemounity.hatenablog.com

sawalemounity.hatenablog.com