← Все вопросы
Чем отличаются px, em, rem и % в CSS?
16
Задаю размеры шрифта и отступы то в px, то в rem, то в процентах — и не понимаю, когда что использовать. Объясните разницу между px, em, rem и %.
3 ответа
33
✓ Принятый ответ — помог автору
Разница в том, ОТНОСИТЕЛЬНО ЧЕГО считается размер:
- px — абсолютные пиксели, фиксировано.
16pxвсегда 16px. - em — относительно размера шрифта ТЕКУЩЕГО элемента (а для самого font-size — родителя). Опасно вложенностью: em'ы перемножаются.
- rem — относительно размера шрифта КОРНЯ (
<html>, обычно 16px).1rem= 16px по умолчанию, не зависит от вложенности — поэтому это сейчас выбор по умолчанию для шрифтов и отступов. - % — относительно соответствующего размера родителя (для width — ширины родителя).
Практика: шрифты и отступы — rem, ширины адаптивных блоков — % или vw, бордеры/мелочи — px.
Сергей Ерошевич наконец-то понял почему em'ы «плывут» при вложенности · 7 месяцев назад
12
rem считается от корневого html, em — от родителя, px — фиксированный, % — от родителя. Бери rem и не мучайся.
4
Для шрифтов — rem.
Ваш ответ
Войдите, чтобы ответить на вопрос.