remを使って文字のサイズを設定しよう

html { font-size: 62.5%; } body { font-size: 1.5rem; } h1{ font-size: 2.8rem; } h2 { font-size: 2.0rem; } 「html」に62.5%を付けると、基準となる文字サイズが10pxとなるので大変便利です。 16pxを指定したい場合は1.6remとします。125pxを指定したい場合は12.5remとすれば設定できます。とっても簡単ですね。 ちなみになぜ62.5%で10pxになるかというと、多くのブラウザではデフォルトのフォントサイズが16pxで設定されています。 10pxはというと・・・デフォルトで指定されている16pxで割れば出ますね。 計算すると0.625という値が出てきます。 つまりフォントサイズを「62.5%」と指定すれば10px程度の文字サイズとなるわけですね。 ・・・余談ですが、デバ