Ответы Mail.ru
Программирование
Android
C/C++
C#
iOS
Java
JavaScript
jQuery
SQL
Perl
PHP
Python
Веб-дизайн
Верстка, CSS, HTML, SVG
Системное администрирование
Другие языки и технологии
Лидеры категории
Лена-пена
М.И.
Y.Nine
•••
Искусственный Интеллект
Искусственный Интеллект
Искусственный Интеллект
Для чего нужны единицы измерения em и rem в CSS?
Евгений Иванов
(46),
закрыт
4 года назад
Встретил адаптивный макет где размер шрифта, padding и margin, а также медиа запросы заданы в единицы измерения em и rem... (точнее медиа запросы только в em). Что за единица измерение такая rem? Как ей пользоваться при задании своих padding и margin, медиа запросов? И почему авторы макета выбрали именно такой подход, например вопреки процентам?
Лучший ответ
Dima like
(1445)
4 года назад
Евгений ИвановУченик (46)
4 года назад
Спасибо большое, понял. А в медиа запросах что берётся за основу если они в em? Просто статьи при "гугляже" )) по данной теме преимущественно на английском...
Dima like
Мастер
(1445)
https://learn.javascript.ru/css-units
Остальные ответы
Yulia Amake
(16283)
4 года назад
% используются, когда размер должен зависеть от размеров родителя,
а em – от текущего размера шрифта (rem от базового).
Что использовать – зависит от задачи, например, для сеток %, а вот чтобы текст при любом размере и разрешении экрана был читабельным и/или элементы рядом были соразмерными - для этого нам нужны em.
В общем, поэкспериментируйте и со временем поймете, что и почему в конкретной ситуации лучше использовать.
а em – от текущего размера шрифта (rem от базового).
Что использовать – зависит от задачи, например, для сеток %, а вот чтобы текст при любом размере и разрешении экрана был читабельным и/или элементы рядом были соразмерными - для этого нам нужны em.
В общем, поэкспериментируйте и со временем поймете, что и почему в конкретной ситуации лучше использовать.
Евгений ИвановУченик (46)
4 года назад
Да не другое я спросил, что от чего берётся в самой верстке ясно... А вот мне теперь надо первый, брекпоинт, он 480px. Сколько это em? Тегу HTML задать font-size 16px и тогда 480 делим на 16? Так что ли?)))
Yulia Amake
Мудрец
(16283)
Брекпоинты никак не зависят от от заданных вами размеров в ccs, они зависят от базового размера шрифта браузера и вы на это никак не можете влиять (если пользователь изменит масштаб или настройки в браузере, базовый размер тоже изменится). Исключение в Safari (баг ил фича хз :)) ) – если использовать rem размер шрифта в html влияет, поэтому лучше em.
На десктопе по ум. и при обычном масштабе это 16px, поэтому 480/16 = 30em
Похожие вопросы