サイズ指定のpx,%,em,remについて

サイズ指定には絶対値と相対値があります。
-絶対値　px
-相対値　%、em、rem

絶対値とは他の値に左右されない値のことを言います。
相対値とは他の値を参考に数値が決まる値のことを言います。

%とemについて

%とemは親要素を元に値を決めます。
%は

<divclass = "container"><divclass = "hello">Hello World</div></div>

.container{font-size:10px;}.hello{font-size:200%;}

とすると親要素の10pxの200%なので2倍となります。

emは
1em = 100%なので

<divclass = "container"><divclass = "hello">Hello World</div></div>

.container{font-size:10px;}.hello{font-size:2em;}

とすると同じく2倍になります。

remについて

remは%、emと少し違い、親要素は一緒でもルート要素を元にします。
ルート要素とはhtmlセレクタを指します。

.html{font-size:20px;}.hello{font-size:1rem;}

この場合ルート要素の20pxに1remなので1倍となり、20pxの大きさになります。