CSSのfont-familyプロパティで、スクリーンフォントの種類を指定してやる場合、なるべく閲覧者のパソコンの中で一番美しいフォントで表示できるように工夫してやると良いでしょう。font-familyプロパティは、フォントを複数指定してやることで、第一候補、第二候補、第三候補・・・と言う設定をすることができます。色々な情報から筆者が良いと思ったフォントの設定方法をご紹介します。
font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
（例文）親譲（おやゆず）りの無鉄砲（むてっぽう）で小供の時から損ばかりしている。小学校に居る時分学校の二階から飛び降りて一週間ほど腰（こし）を抜（ぬ）かした事がある。なぜそんな無闇（むやみ）をしたと聞く人があるかも知れぬ。別段深い理由でもない。新築の二階から首を出していたら、同級生の一人が冗談（じょうだん）に、いくら威張（いば）っても、そこから飛び降りる事は出来まい。弱虫やーい。と囃（はや）したからである。小使（こづかい）に負ぶさって帰って来た時、おやじが大きな眼（め）をして二階ぐらいから飛び降りて腰を抜かす奴（やつ）があるかと云（い）ったから、この次は抜かさずに飛んで見せますと答えた。
font-family: "ヒラギノ明朝 Pro W3","Hiragino Mincho Pro","ＭＳ Ｐ明朝","MS PMincho",serif;
（例文）親譲（おやゆず）りの無鉄砲（むてっぽう）で小供の時から損ばかりしている。小学校に居る時分学校の二階から飛び降りて一週間ほど腰（こし）を抜（ぬ）かした事がある。なぜそんな無闇（むやみ）をしたと聞く人があるかも知れぬ。別段深い理由でもない。新築の二階から首を出していたら、同級生の一人が冗談（じょうだん）に、いくら威張（いば）っても、そこから飛び降りる事は出来まい。弱虫やーい。と囃（はや）したからである。小使（こづかい）に負ぶさって帰って来た時、おやじが大きな眼（め）をして二階ぐらいから飛び降りて腰を抜かす奴（やつ）があるかと云（い）ったから、この次は抜かさずに飛んで見せますと答えた。
上がゴシック体を使用する場合のフォントファミリーの設定です。読み方は、第一候補が「ヒラギノ角ゴ Pro W3」、第二候補が「Hiragino Kaku Gothic Pro」・・・という感じです。少数派であるMacintoshのフォントを何故優先的に設定するかと言いますと、Macintoshユーザーの中にはMSオフィスをインストールしている人が結構いて、その人達のパソコンでＭＳ系フォントが表示されるのを防ぐためです。逆にWindowsパソコンにヒラギノフォントをインストールしている人はまず居ませんので、ヒラギノの設定は読み飛ばされます。
下は明朝系フォントを指定する場合の設定です。こちらもMacintoshユーザーの人にはヒラギノフォントで見てもらいましょうという設定をしております。Windowsパソコンの人はヒラギノは読み飛ばされてＭＳ Ｐ明朝で閲覧する形になります。
次にメイリオがＭＳ系フォントよりも先に設定されているのは、Windows Vistaや7でメイリオフォントを表示させたいからです。前項でも説明しましたが、ＭＳ系フォントよりもメイリオのほうがアンチエイリアスが掛かっていて美しいからです。
末尾に書いている、sans-serif・serifというフォント設定は、該当するフォントがいずれも無ければゴシック系フォント（sans-serif）、明朝系フォント（serif）で表示しましょうというおまじないみたいなものです。
「ヒラギノ角ゴ Pro W3」「Hiragino Kaku Gothic Pro」、「メイリオ」「Meiryo」のように、日本語表記と英語表記を両方とも記述するのは、Safariブラウザで、日本語表記の日本語フォントを解釈してくれないからです。また逆に、FireFoxブラウザでは英語表記の日本語フォントを解釈してくれないので、日本語フォント名は日本語・英語と両方書く必要があるということになります。