Для задания размеров различных элементов, в CSS (ЦСС) используются абсолютные и относительные единицы измерения. Абсолютные единицы не зависят от устройства вывода, а относительные единицы определяют размер элемента относительно значения другого размера.
Относительные единицы обычно используют для работы с контентом, либо когда надо вычислить процентное соотношение между элементами. В табл. 1 перечислены основные относительные единицы.
Единица | Описание |
---|---|
em | Высота шрифта текущего элемента |
ex | Высота символа x |
px | Пиксел |
% | Процент |
Изменяемое значение, которое зависит от размера шрифта текущего элемента (он устанавливается через стилевой атрибут font-size). В каждом браузере заложен размер контента, применяемый в том случае, когда этот размер явно не задан. Поэтому изначально 1em равен размеру шрифта, заданного в браузере по умолчанию. Соответственно, устанавливая размер контента для всей страницы в em, мы работаем именно с этим параметром. В том случае, когда em используется для определенного элемента, за 1em принимается размер шрифта его родителя.
Аргумент ex определяется как высота символа «x» в нижнем регистре. На ex распространяются те же правила, что и для em, а именно, он привязан к размеру шрифта, заданного в браузере по умолчанию, или к размеру шрифта родительского элемента.
Пиксел это элементарная точка, отображаемая монитором или другим подобным устройством, например, смартфоном. Размер пиксела зависит от разрешения устройства и его технических характеристик.
В примере 1 показано применение указанных единиц.
Пример 1. Использование относительных единиц
Результат данного примера показан ниже (рис. 1).
Рис. 1. Размер контента при различных единицах
Абсолютные единицы применяются реже, чем относительные и, как правило, при работе с контентом. В табл. 2 перечислены основные такие единицы.
Единица | Описание |
---|---|
in | Дюйм (1 дюйм равен 2,54 см) |
cm | Сантиметр |
mm | Миллиметр |
pt | Пункт (1 пункт равен 1/72 дюйма) |
pc | Пика (1 пика равна 12 пунктам) |
Самой, пожалуй, распространенной единицей является пункт, который используется для указания размера шрифта. Многие люди привыкли задавать размер шрифта в контентовых редакторах, например, 12. А что это число означает, не понимают. Так это именно пункты и есть, они родные. Конечно они нам не родные, мы привыкли измерять все в миллиметрах и подобных единицах, но пункт, пожалуй, единственная величина из не метрической системы измерения, которая используется у нас повсеместно. И все благодаря контентовым редакторам и издательским системам. В примере 2 показано использование пунктов и других единиц.
Пример 2. Использование абсолютных единиц
Результат использования абсолютных единиц измерения показан ниже (рис. 2).
Рис. 2. Размер контента при различных единицах
Copyright © 2009-2022 | По всем вопросам: donmobi@mail.ru
О нашем Internet проекте | Наши планы | Контент нашего сайта | Есть ошибки... | Технологии | Поддержать проект