本ブログでは、Theme に「ThemeZee.com::zeeSynergie」を採用していますが、最近この Theme で気になっているのがフォントサイズ!海外で開発された Theme は当然ですが日本語フォントに関する検討はしていないでしょうから調整が必要と私は信じてるのですが、それよりもフォントサイズの単位に、px や em や % が使われているのです。
どうしてバラバラの単位!??
これまで、私はフォントサイズには「pt(ポイント)」を使って固定していましたが、モダンブラウザが拡大や縮小ができるようになって、その調整が不可能な「pt」は利用すべきではなく・・・ということをどっかのウェブサイトで読んだので急遽「pt」に似ている「px(ピクセル)」を適用した記憶があります。しかし、「px」も十分ではなく・・・って、いったいどれを利用すれば良いのか全く理解できずにネットを調べてみるとどうやらまだまだ結論が出ていないようです。ただ、「pt」、「px」、「em」の関係は知っていて損はなさそうです。
すると・・・「PXtoEM.com」という凄いサイトを発見!(って、有名だったりして・・・)このサイト、自分のベースフォントサイズを決定すると、そのフォントサイズに合わせていろいろなフォントサイズの換算表を自動生成してくれる!しかも、「pt」、「px」、「em」の比較表を生成してくれて、更に CSS も自動生成してくれます。凄い!
ベースのフォントサイズを「12pt」とした時に生成される比較表も掲載しておきましょう。全て、上記のサイトやってくれます。
| Pixels | EMs | Percent | Points |
|---|---|---|---|
| 6px | 0.375em | 37.50% | 5pt |
| 7px | 0.438em | 44% | 5pt |
| 8px | 0.5em | 50.00% | 6pt |
| 9px | 0.563em | 56.30% | 7pt |
| 10px | 0.625em | 62.50% | 8pt |
| 11px | 0.688em | 69% | 8pt |
| 12px | 0.75em | 75.00% | 9pt |
| 13px | 0.813em | 81.30% | 10pt |
| 14px | 0.875em | 87.50% | 11pt |
| 15px | 0.938em | 94% | 11pt |
| 16px | 1em | 100.00% | 12pt |
| 17px | 1.063em | 106.30% | 13pt |
| 18px | 1.125em | 112.50% | 14pt |
| 19px | 1.188em | 119% | 14pt |
| 20px | 1.25em | 125.00% | 15pt |
| 21px | 1.313em | 131.30% | 16pt |
| 22px | 1.375em | 137.50% | 17pt |
| 23px | 1.438em | 144% | 17pt |
| 24px | 1.5em | 150% | 18pt |


