Встречайте Единицы
- «Ems» (em): «em» - это масштабируемая единица, которая используется в веб-документе.
средства массовой информации. Em равен текущему размеру шрифта, например, если
размер шрифта документа 12pt, 1em равен 12pt. Эмс
масштабируемый по своей природе, так что 2em будет равно 24pt, .5em будет равно 6pt,
и т.д. Ems становятся все более популярными в веб-документах из-за
масштабируемость и их дружественность к мобильным устройствам.
Пиксели (px): Пиксели - это единицы фиксированного размера, используемые на экране.
носитель (т. е. для чтения на экране компьютера). Один пиксель равен
до одной точки на экране компьютера (наименьшее деление вашего
разрешение экрана). Многие веб-дизайнеры используют пиксельные единицы в сети
документы для получения точного представления
их сайт, как он отображается в браузере. Одна проблема с
пиксельная единица состоит в том, что она не масштабируется вверх для слабовидящих
считыватели или вниз, чтобы соответствовать мобильным устройствам.
Очки (pt): Очки традиционно используются в печатных СМИ (что угодно
это должно быть напечатано на бумаге и т. д.). Одна точка равна 1/72
дюйм. Точки очень похожи на пиксели в том, что они имеют фиксированный размер
единицы и не могут масштабироваться по размеру.
Процент (%): процентная единица очень похожа на единицу «em», за исключением
Несколько принципиальных отличий. В первую очередь, текущий
размер шрифта равен 100% (то есть 12pt = 100%). При использовании
в процентах, ваш текст остается полностью масштабируемым для мобильных устройств
и для доступности.
Итак, в чем разница?
Легко понять разницу между единицами размера шрифта, когда вы видите их в действии. Обычно 1em = 12pt = 16px = 100%. При использовании этих размеров шрифта давайте посмотрим, что произойдет, когда вы увеличите базовый размер шрифта (с помощью селектора CSS для тела) со 100% до 120%.
Как вы можете видеть, как em, так и проценты увеличиваются при увеличении базового размера шрифта, а пиксели и точки - нет. Может быть легко установить абсолютный размер для вашего текста, но вашим посетителям гораздо проще использовать масштабируемый текст, который может отображаться на любом устройстве или любом компьютере. По этой причине для текста веб-документа предпочтительнее использовать em и процентные единицы.
Em против процентов
Мы решили, что точечные и пиксельные единицы не обязательно лучше всего подходят для веб-документов, что оставляет нам единицы em и проценты. Теоретически, и em, и процентные единицы идентичны, но при применении они на самом деле имеют несколько незначительных различий, которые важно учитывать.
В приведенном выше примере мы использовали процентную единицу в качестве базового размера шрифта (для тега body). Если вы измените базовый размер шрифта с процента на ems (то есть body {font-size: 1em;}), вы, вероятно, не заметите разницы. Давайте посмотрим, что происходит, когда «1em» - это размер шрифта нашего тела, и когда клиент изменяет настройку «Размер текста» своего браузера (это доступно в некоторых браузерах, таких как Internet Explorer).
Когда размер текста в браузере клиента установлен на «средний», разница между ems и процентами отсутствует. Однако при изменении настройки разница довольно велика. При настройке «Smallest» значения ems намного меньше процента, а при настройке «Largest» все наоборот: значения ems намного больше процента. Хотя некоторые могут утверждать, что модули em масштабируются так, как они на самом деле предназначены, при практическом применении текст em масштабируется слишком резко, причем на некоторых клиентских компьютерах самый мелкий текст становится едва различимым.
Информация взята из http://kyleschaeffer.com