親要素に対して相対的な値を指定。
オブジェクトのレイアウトなどにも使用される。

em

親要素に対して相対的な値を指定。
%と似ているが、emは基本的に文字のサイズ指定に使うことが多い。

親：１０px に対して 0.5em と指定 → 5px のフォントサイズとなる

.parent {
   font-size : 10px;

   .child {
     font-size : 0.5em;
    }
}

親のpxを変更するだけで、現在の比率を変えずにfont-sizeを変更することができる。

rem

常にhtmlに対して相対的な値を指定。
% em と違い、htmlの値だけを見ていればいい。
htmlでfont-sizeが指定していなければ、デフォルトで16pxとなる。
○rem → htmlのfont-sizeの○倍の大きさ

1rem → 16px
2rem → 36px
0.5rem → 8px

vw

表示領域の幅に対する割合。
ビューポートの幅に合わせてfont-sizeの値を指定できる。

font-sizeを 10vw と指定　→ ビューポートの幅に対して 10% のフォントサイズとなる

おわり

適切なfont-sizeはSEOの面でも重要！
→ PCでは適切な文字サイズでも、モバイルで小さすぎたらダメ（モバイルフレンドリーではないと判定される）

細かいことだと感じますが、ここをしっかり考えれるようになりたいです。