HOME > ウェブデザイン > 【CSS】font-family を見直してみた
公開日:2010.12.15
この記事は約2分で読めます。

【CSS】font-family を見直してみた

この記事は最終更新日から9年以上経過しているため現状にそぐわない可能性もあります。

CSSのfont-familyの書き方がいまいちわからず、これまでは参考ページのCSSを単純にコピペしてきました。

でも最近ようやく書き方がわかってきたようです。

SIRIUSレビューイメージ画像

フォントファミリー

わかっているようでよくわかっていなかったのが、

  • フォントをダブルクォーテーション(")またはシングルクォーテーション(')のどちらで囲むべきなのか
  • 囲んでないフォントもあるけどどう違うのか
  • 「tahoma」や「Verdana」というフォント名が最初に来るパターンも見られるがなぜなんだろう

いろいろ調べていくと次のようなことがわかってきましたよ。

  • 「MS ゴシック」や「MS 明朝」のようにフォント名にスペースが含まれる、あるいは日本語表記の場合は、フォント名をクォーテーションで囲むということ。
  • その際ダブルクォーテーション(")またはシングルクォーテーション(')のどちらで囲ってもよいということ。
  • 日本語フォント名はブラウザによっては認識できないこともあるので、英文字でのフォント名も併記しておくということ。
  • tahomaやVerdanaというフォントはモニター画面上で非常に読みやすく、またWindowsに標準でインストールされているので重宝されているらしいこと。

ということで当ブログでは font-family をあらためて以下のようにしてみました。

font-family: Tahoma, "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "MS Pゴシック", sans-serif;

でもこの問題は非常にデリケートであり、OSやブラウザの違いでいかようにも表示される可能性があるので、思い切って何も指定しないってのもありかも。

以上です。

スポンサーリンク

スポンサーリンク

記事はお役にたてましたか?

記事に興味をもっていただけたらソーシャルボタンでの共有お願いします^^

 ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓ ↓

コメントはお気軽にどうぞ

メールアドレスは公開されません。
* が付いている欄は必須項目です。

内容に問題なければ下記の「コメントを送信する」ボタンを押してください。

日本語が含まれない投稿は無視されますのでご注意ください。(スパム対策)