[ CSS ] フォントサイズを統一＆サイズ変更できる指定方法

本文を 12 ピクセル相当の大きさで表示すべく、font-size:75%; で指定されたページを Mac Firefox 2.0 で見ると文字が小さく見えます。

これは、Mac Firefox 2.0 のデフォルトフォントサイズが 14 ピクセルの為で、計算してみると 10.5 ピクセル相当の大きさでレンダリングされている事になります。

14px * 75% = 10.5px

確かに小さいですねー。

この問題を解決すべく、各ブラウザで同じフォントサイズを実現するには、font-size:12px; とかのピクセル指定すれば良いだけなんですが、Windows Internet Explorer 7 で文字のサイズ変更が出来なくなってしまうのでピクセル指定はアウト。

と言う事で、やりたい事

こんな感じで、色々調べてみました。

この記事の目次非表示

CSS の設定方法

body {
  font-size: 75%; /* IE に適用 */
}
html>/**/body {
  font-size: 12px; /* IE 以外に上書き適用 */
}

後方互換モードの事はあまり考えていません。ゴメンナサイ。

ありがとうございます。

ちなみに、Mac Safari 2.0 のデフォルトフォントサイズは 16 ピクセルなんですが、等幅フォントの時は 13 ピクセルになってるんですよねー。なんでだろ？

現場からは以上です。それでは、またッ！！！

だるかぶ

最後までお読みいただきありがとうございます！スキ・コメント・シェア・フォローなどで応援いただけると『だるかぶ』のやる気がアップします！

記事内容の修正について 記載している内容は記事執筆時の情報です。できるだけ最新情報を掲載するようにしていますが、情報が間違っている場合は「コメント」でご指摘いただけるとありがたいです。