WEBサイト制作時のフォントサイズの指定について

 WEBサイト制作において、フォントサイズはピクセルで指定するのが最もわかりやすい。

 作る際にピクセルでフォントサイズを指定し、あとは勝手にユーザ側で大きくするなり小さくするなりすればいいと思う。しかし Windows IE はピクセル指定されたフォントは表示を固定してしまい、ユーザ側で大きさを変更できない(この問題は IE7  になってもまだ残されたままだ)。

 そこで、作る側としては、とりあえずピクセル指定した後、IE用のCSSハックを用いて相対指定するという若干面倒な作業をしてきたわけだが、その際に使用するCSSハックはアンダースコア・ハックが一番手軽だった。ところが IE7 ではこのアンダースコア・ハックは無視するようになってしまったのだ(互換モードのときは使えるらしいが)。なんてこった。

 だから今後はもういっそのこと、フォントサイズはすべて相対指定にして、いちいちブラウザを区別するのはやめてしまおうと思っている。

 その際、最初に CSS で * { font-size: 100%; } としてすべての要素をデフォルト(ユーザが環境設定を変更していなければ通常は 16px だ)にしてしまい、あとはそこからの相対パーセンテージで指定するのがおそらくもっとも簡単な方法だという気がする。

 ただ、相対指定は親要素の値を引き継ぐから、親が 80% サイズのとき、子を 75% とすると、元のサイズからは 60% になってしまうため若干注意が必要だ(だからピクセル指定のほうが便利なのに、MSのバカヤロー)。しかしそれさえクリアすれば後は下記のサイズ指定ですむはずだ。

文字サイズ 16px = 100% とした場合のパーセンテージ計算値

px 32 28 26 24 22 20 18 16 14 13 12 11 10 9 8
% 200 175 162.5 150 137.5 125 112.5 100 87.5 81.25 75 68.75 62.5 56.25 50


Tail-Lagoon @ 12:26

コメントおよびトラックバック受付中です。
TB : http://weblogs.tail-lagoon.com/WebPC/2008/03/06/11/trackback/

コメントをどうぞ

この投稿へのコメントは RSS 2.0 フィードで購読できます。