フォントは何を使いましょう？

CSS（スタイルシート）で指定できるフォント関連のプロパティは以下の通り。

それでは、個々のプロパティについての値について見ていきましょう。

……と、いきたいのですが、ここは別にCSSの説明ページじゃないので（笑）、このページを作った趣旨を、先に述べたいと思います。

ところで皆さんはフォントの指定をする時にどうやって指定していますか？自分は面倒臭がり屋なのでこの「fontプロパティ」を使って、一括指定しています。
「fontプロパティ」を使った場合の指定項目は次のようになります。

つまり

というふうに、一挙に6種類もの設定を行えるという、なんとも欲張りな……え？そんないっぺんに設定するのは逆に面倒臭いんじゃないかって？そこは、それ、実は属性の値の省略っていうのができまして。

省略っていっても、W3C（CSSのルールを作っているとこ）の定義では『font-size』と、『font-family』は必ず設定する事となっていまして、IEの場合は、この２つを省略しても、一応きちんと表示されるのですが、ネスケの場合は、どちらかの値を抜いてしまっただけで、「fontプロパティ」は無視されてしまいます。ってことは……

話が本筋から離れてしまいますが、皆さん、HPを作るときにNN4.xのフォントが小さいので困った事はありませんか？自分もいつもfont-sizeはだいたい0.8emで設定しているのですけど、これをデフォルトの設定でNN4.xで見ると、文字が米粒以下の大きさになってしまって、全然見れなくなってしまう。まぁ、emというのは相対的な値なので、ブラウザの方で文字サイズを大きくしてもらえば、それで済む事なんですが、なんだかちょっと気分が悪い。で、そこでこの「fontプロパティ」の設定で、わざと『font-size』の指定だけにしておくと、ネスケでは無視されるので、IEでは文字はいい感じで小さく表示され、NN4.xでは、そのままブラウザのデフォルトの値で表示されるわけです。

こういう使い方は本来のCSSの使い方ではないので、最近は自分も使っていませんが、一応、覚えておいて損はないと思います。というわけで、自分はいつも「fontプロパティ」を使っているというわけですね。

逆に言えば、「fontプロパティ」を使う時には、必ずフォントの種類を指定しなければならないわけです。それだけなら別に大した問題ではないのでしょうけど、OSで同じゴシック体だとしてもフォントの名称が変わる事、知ってました？

OSごとのフォント名が違うことについて、実はちゃんとCSSでは簡単な救済措置がとられています。それが「フォントファミリー名」です。「フォント名」との違いは、「フォント名」がそのままフォントの名前を表しているのに対し、「フォントファミリー名」は、良く似た特徴を持つフォントをカテゴリー分けしたキーワードだということです。以下にその一覧を書き記します。

だだし……上の（注）にもあるように、一部ブラウザ―では対応していないこともあるので、基本的にはまず「フォント名」を指定してから、最終手段として「フォントファミリー名」を指定した方が無難なようです。というわけで、WindowsとMacOSでのデフォルトでインストールされるものの中から、よく似たフォントを抜き出してみると、「font-style」の値は、だいたい以下のような感じになると思われます。

で、結局……自分が使いやすいようにまとめると、「fontプロパティ」は次のようにまとめられます。

あ〜、これが書きたかっただけなんで、後はオマケです。オマケ。しんどいなぁ。