rem

レム（値）

意味ルート要素に対する相対的な単位

remとは？

remは「root em」の略で、長さの単位の一つです。この単位は、ドキュメントのルート要素（通常はhtml要素）のフォントサイズに対する相対サイズを指定するために使用します。rem単位を使うと、ページ全体のフォントサイズを一元的に調整することが容易になります。

remの具体的な使い方

フォントサイズをremで指定する例

<style>
    .rem-size {
        font-size: 2rem;
    }
</style>

<p class='rem-size'>2倍のルートフォントサイズ</p>

段落（p要素）のフォントサイズをルート要素のフォントサイズの2倍に設定しています。

パディングをremで指定する例

<style>
  html {
    font-size: 16px;
  }
  .padding-rem {
    padding: 1rem;
  }
</style>

<div class='padding-rem'>
  パディングを1rem設定
</div>

ルート要素のフォントサイズを16pxに設定し、div要素のパディングを1rem（16px）に設定しています。

remに関するよくある質問

Q. remの基準は何ですか？

A. remは、ルート要素（通常はhtml要素）のフォントサイズを基準とします。

Q. remを使う利点は何ですか？

A. remを使うと、ページ全体のサイズを一元管理しやすくなり、一貫性のあるデザインを作りやすくなります。また、ユーザーの設定を尊重しやすくなります。

Q. remとpxはどちらを使うべきですか？

A. 状況によって異なります。固定サイズが必要な場合はpxを、相対的なサイズ調整が必要な場合はremを使用するのが一般的です。レスポンシブデザインにはremがより適しています。

remが学べる書籍の紹介

「プログラミング単語帳」を使って、プログラミングの単語を英単語のように学習してみませんか？
プログラミング単語帳には、CSSのremやinherit、none、ease-in-out、などのような実務でよく使われる単語が数百以上収録されています。
この書籍には、プログラミングの単語の意味や読み方、単語の使い方がわかる例文などが掲載されており、いつでもどこでもプログラミングの学習ができます。

よく使われる単語にだけ絞って学習することができるので、効率的にプログラミングが学習できます。