CSSでフォントの指定はいろいろありますが、わたしがお勧めするのは%指定かem指定です。他にも沢山指定の仕方がありますが、この二つがベターなのではと思います。なぜベストではないの?と思うかもしれませんが、まだまだ勉強不足なだけかもしれないので、そう言ったまでです。
今回紹介する方法はWeb Designingで紹介されている方法です。
では実際に%指定かem指定でやってみましょう?まず私がお勧めするのは全称セレクタで全てのフォントサイズを指定する方法です。
*{
margin: 0;
padding: 0;
font-size: 100%;
}
これで全てのタグのマージンとパッディングが0になります。またフォントサイズもデフォルトの指定を100%に揃えます。次の指定がポイントになります。
body{
font-size: 62.5%;
}
こ
うすることにより全てのフォントサイズを約10pxとすることができます。ここからem指定をすると、基準値(1em)が約10pxとなっていますので、
20pxにしたい時は2emになります。16pxならば、1.6emとなります。あとは任意のタグやクラスにサイズを指定していくだけでできあがりです。
こうすることで思い通りのフォントサイズが実現できるはずです。
また何かいい方法あったら紹介します。
しかし注意点もあります。入れ子になった要素では直感的には指定ができなくなります。指定は極力、子の要素に指定をしないといけなくなります。またこの方法はデフォルトの文字サイズが16pxでそれを変更せずに使っているということが前提になります。設定が変わっていれば当然意図したサイズでは表示できなくなります。