rem

You are here:
← All Topics
Table of Contents

 

remとは、デフォルトで指定されている文字の高さ(フォントサイズ)を基準にした単位。

文字サイズを基準にした点でemと似ていますが、emは親要素の文字サイズ、remはルートの文字サイズを基準にしている点が違います。
ルートとは「このホームページは基本16pxで行くから!」のようにホームページ全体に指定された文字サイズのこと。

基本16pxなんだけど見出しは30pxにしよう」のように、それぞれの要素に対して個別に指定されたものが親要素となります。

[rem]
ルートサイズは16px。30pxのサイズに指定された見出しの行間に1remを指定した場合、1rem=16pxになります。
[em]
ルートサイズは16px。30pxのサイズに指定された見出しの行間に1emを指定した場合、1em=30pxになります。

remの利点はルートサイズさえ覚えておけば常に一定のサイズを指定できること。親要素のサイズをその都度確認する手間が省けます。

FaceBook Instagram messager Pintarest