rem

Единица rem соответствует значению свойства font-size корневого элемента <html>. Если rem добавляется непосредственно к font-size для <html> или стиль для <html> не задан, тогда 1rem принимается равным исходному значению font-size. В браузерах по умолчанию 1rem = 16px.

Пример

Код примера скопирован в буфер
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>rem</title>
  <style>
   html { font-size: 62.5%; }  /* 10px */
   body { font-size: 1.8rem; } /* 18px */
   h1 { font-size: 2.8rem; }   /* 28px */
  </style>
 </head>
 <body>
  <h1>Почему возможна интроекция?</h1>
  <p>Как отмечает Д. Майерс, у нас есть некоторое чувство конфликта, 
   которое возникает с ситуации несоответствия желаемого и действительного.</p>
 </body>
</html>

В данном примере размер шрифта для корневого элемента задан в процентах, в итоге получается равным 10px. Для размеров основного текста и заголовка применяется единица rem, которая считается относительно уже заданного размера html.

Спецификация

Спецификация Статус
CSS Values and Units Module Level 4 Рабочий проект
CSS Values and Units Module Level 3 Возможная рекомендация

Браузеры

9 12 4 11.6 4.1 3.6
2 4 12 4

См. также