CSSの単位について

今回は、CSS3の単位について書いていこうと思います。

Progateで勉強すると、単位については、px（ピクセル）と％（パーセント）の２つだけだと思います。

そして、独学で勉強すると、isaraさんのサイトの模写など実際のページを見ながら、勉強する方も多いと思います。

そこで、初めて、emやremと言った見たことない単位の文字サイズや要素の大きさの指定の仕方を見て困ったことかと思います。

そんな方向けに今回は書いていこうと思います。

今回の記事の内容（見出し一覧）

• （結論）まずは、emとremを覚えよう
• 相対単位と絶対単位
• 単位一覧

では、やっていきましょう。

（結論）まずは、emとremを覚えよう

はい、今回の結論です。

理由は簡単で、pxと%の他にemとremを多く使うからです。

相対単位と絶対単位

単位は大きく、相対単位と絶対単位に分けられます。

絶対単位は、

Progateをやったあとだと、pxがあります。

画面サイズや親要素、子要素の大きさなどの大きさに関係なく、常にその大きさの要素になります。言いかいると、どんな状況でも、指定された大きさになります。

相対単位は、

Progateをやったあとだと、%があります。そして、先ほど挙げた、emとremもそうです。

こちらは、画面サイズや親、子要素の大きさに応じて、指定した要素の大きさに変化します。

レスポンシブなサイト（スマホやタブレットにも対応したサイト）を作るなら、こちらで指定した方が、手間が省けます。

単位一覧

絶対的単位

相対的単位

※ルート要素・・・htmlタグのこと。厳密には、全ての要素の一番上にある要素のこと

まとめ

以上が、単位の一覧です。

今回は、フォントサイズや要素の大きさを決める単位について、独学で進めていたのですが、そこまでちゃんと勉強していなかったので、ブログにまとめてみました。

同じように、独学で勉強している方の助けになれればと思います。