Уроки CSS. Относительные единицы измерения в CSS: px, %, em. rem.
Тематическая группа (веб-дизайн): https://vk.com/zametkipohtml
Официальный паблик в ВК: https://vk.com/zametkinapolyah
Рубрика по теме в блоге: http://zametkinapolyah.ru/verstka-sajtov
Не забудь подписаться и нажать палец вверх: https://www.youtube.com/user/zametkinapolyahru
Помощь проекту:
WMR: R288272666982
WMZ: Z293550531456
Яндекс.Деньги: 410011531129223
Единицы измерения размеров в CSS можно разбить на две большие группы: абсолютные единицы измерения и относительные единицы измерения. Абсолютные единицы измерения уже давно умерли, но о них мы все равно поговорим, возможно, вы их где-нибудь увидите.
Относительные единицы измерения:
пикселы (px) – пиксел относительная единица измерения лишь потому, что это точка на экране, размер которой в CSS зависит от характеристик экрана (также px = 1/96 дюйма), любые другие значения браузер конвертирует в пикселы автоматически, значения могут быть дробными, например 33.3333333px;
размер шрифта (em) – в CSS em – это изменяемое значение, которое зависит от размера шрифта текущего элемента веб-страницы или его родителя и изменяется при помощи свойства font-size (запись 1em эквивалентна записи 100%), также значения могут быть дробными, например, 0.3em (к разговору о em мы еще вернемся, когда будем говорить о работе со шрифтами);
высота символа х (ex) – единица измерения ex аналогична по своему поведению em, но за базовый символ принимается x в нижнем регистре;
высота символа 0 (ch) – единица измерения ch в CSS также является относительной и на нее действуют все правила, которые применяются к em, но базовым символом является ноль;
проценты (%) – проценты в CSS относятся к относительным единицам измерения, обычно проценты от чего-нибудь отсчитываются и обычно процент в CSS берется от размеров родительского элемента, но это не всегда так, например, для свойства margin-left процент берется от свойства width родительского элемента, а не от свойства margin-left, для свойства line-height процент берется от размера шрифта текущего элемента, а не его родителя, есть и другие примера, читайте сайт w3.org;
единица rem – это смесь px и em в CSS и относится к относительным единицам измерения, эта единица измерения не работает в IE 8, но зато она позволяет задать размер шрифта относительно размера шрифта для контейнера html, а не для родителя.
Кирилл Антонов
Канал для начинающего веб-разработчика. Здесь ты найдешь различные видео уроки о технологиях и программном обеспечение, которые используют веб-разработчики.
Последние сообщения
127 полезных и бесплатных онлайн академий
23.04.2019
