css3で追加されたremが便利。remだと親要素の影響を受けない。対応ブラウザはIE9+、Firefox3.6+、Chrome、Safari5。
指定方法は？
html {
font-size: 62.5%;
}
※ベースのフォントサイズを10pxに指定。
p {
font-size: 1.2rem; /* 12px */
}
※2017/2/6 注記 上記のように書いたが、chromeでは、文字が大きくなったるする。
対処法は
body {
font-size: 1.2em; /* emで指定 */
}
ということになる。しかし、IEでは:before、:after要素でバグが出るという報告もある。今のところremは様子見かな・・・
