css3で追加されたremという単位が便利な理由
CSSにおけるフォントサイズの指定は、相対指定の「em」や「%」、絶対指定のpxが一般的です。
また、CSS3に新しく「rem」という単位を使った指定方法もあります。
今回は、remという単位が便利な理由をpxやemと比較してまとめます。
remはレスポンシブウェブデザインにはとても便利な単位です。
まず、ピクセルとエムのおさらい。
px(ピクセル)
ピクセル単位の指定。環境によって変化しない絶対単位です。em(エム)
文字の高さを基準にした単位。1emは1文字分で、環境によって大きさが変化する相対単位。
bodyなどでfont-sizeの指定をしていない場合、あるいはfont-size:100%なら「1em=16px」が基準になります。
主要なブラウザのデフォルトのフォントサイズは、16pxなので、その62.5%（10px）がよく見かけます。pxではなく、%指定にしておくことで、ユーザーがブラウザの設定でデフォルトの文字サイズを変更いた場合にもある程度反映することができます。
remは、「root+em」（ルートエム）の略で、ルート要素のフォントサイズを継承します。
ルートとは、ルート要素、つまり最上位階層に位置する要素のことで、HTML文書では全体をマークアップする範囲のことです。 remはこのフォントサイズを継承します。
emとの比較で見てみましょう。
See the Pen 20160809em by r.shimizu (@r_shimizu) on CodePen.
emは、親要素を継承しないという特徴があり、入れ子にするとどんどん拡大、縮小されてしまったり、指定に細かな計算が必要だったりします。
See the Pen 20160809rem by r.shimizu (@r_shimizu) on CodePen.
ですが、remは常にroot要素（html要素）に対しての相対的なサイズを指定できるので、非常にわかりやすく便利です。
