Один из самых запутанных аспектов CSS это приложение размер шрифта атрибут масштабирования текста.
Используя CSS, вы можете изменять размер текста в браузере, используя четыре разные единицы измерения.
Какой из этих четырех модулей лучше всего подходит для Интернета? Этот вопрос вызвал различные дискуссии и критику.
Найти однозначный ответ сложно, поскольку сам вопрос сложен.
Знакомство с подразделениями
1. «Эмс» (em): «em» — масштабируемая единица, которая используется в веб-документах.«em» равен текущему размеру шрифта, например, если размер шрифта в документе равен 12 пт, 1em равен 12 пт. «em» по своей природе масштабируем, поэтому 2em будет равно 24 точкам, 0,5em будет равно 6 точкам и т. д. Использование «em» становится все более популярным в веб-документах из-за его масштабируемости и возможности быть полезным на мобильных устройствах.
2. Пиксели (px): «px» — это единицы фиксированного размера, которые используются на экранах (например, для чтения на экране компьютера).
Один пиксель равен одной точке на экране вашего компьютера (наименьшему элементу разрешения вашего экрана).
Многие веб-дизайнеры используют px в веб-документах, чтобы добиться идеального представления своего сайта при отображении в браузере.
Одна из проблем использования пикселей заключается в том, что эти единицы измерения не позволяют масштабировать их для слабовидящих читателей или мобильных устройств.
3. Точки (пт): «пт», традиционно используемый в печатных СМИ (все, что необходимо распечатать на бумаге и т.п.
).
Один «пт» равен 1/72 дюйма.
«pt», как и «px», имеют фиксированный размер единицы измерения и не подлежат масштабированию.
4. Проценты (%): процентные единицы аналогичны «em», за исключением нескольких ключевых отличий.
Во-первых, текущий размер шрифта равен 100% (т.е.
12pt = 100%).
Используя «%», ваш текст становится полностью масштабируемым для мобильных устройств и удобным для пользователя (доступностью).
Так в чем же разница?
Будет легко понять разницу между единицами размера шрифта, как только вы увидите их в действии.Обычно 1em = 12pt = 16px = 100%.
Используя эти размеры шрифтов, давайте посмотрим, что произойдет, если вы увеличите базовый размер шрифта (с помощью селектора тела CSS) со 100% до 120%.
Изменение размера шрифта со 100% на 120%.
Как видите, «em» и «%» увеличили размер шрифта, а «px» и «pt» — нет. Установить абсолютный размер вашего текста может быть легко, но для ваших посетителей гораздо лучше использовать масштабируемый текст, который может отображаться на любом устройстве или компьютере.
По этой причине для текста веб-документа предпочтительно использовать единицы «em» и «%».
«эм» против «%»
Мы обнаружили, что единицы измерения «px» и «pt» не лучшим образом подходят для веб-документов, что вынуждает нас использовать «em» и «%».Теоретически единицы «em» и «%» идентичны, но на практике имеют небольшие различия, которые важно учитывать.
В приведенном выше примере мы использовали проценты (в теге body) в качестве базовой единицы размера шрифта.
Если вы измените базовую единицу измерения размера шрифта с «%» на «em» (то есть body {font-size: 1em;}), вы, должен не замечайте разницы.
Давайте посмотрим, что происходит, когда «1em» является нашей базовой единицей и когда клиент меняет «Размер шрифта» в настройках своего браузера (во многих браузерах, таких как Internet Explorer, есть эта опция).
Размер шрифта, когда клиент меняет размер текста в браузере.
Когда в клиентском браузере для размера текста установлено значение «средний», заметной разницы между «em» и «%» нет. Однако если параметр изменить, разница становится очень большой.
При значении «Наименьший» «em» намного меньше «%», а при значении «Наибольший», наоборот, «em» отображается значительно больше, чем «%».
И хотя многие утверждают, что единицы измерения в «em» масштабируются так, как предполагалось, на практике текст в «em» масштабируется слишком сильно, в результате чего самый мелкий текст становится неразборчивым на некоторых машинах.
Вердикт
Теоретически единицы «em» — это новый и будущий стандарт размера шрифта в Интернете, но на практике единицы «%» позволяют отображать текст более последовательно и удобно для пользователей.При изменении параметров клиента текст в «%» менялся в разумных пропорциях, что позволяет дизайнерам сохранять читабельность, доступность и дизайн.
Победитель : процент (%).
Теги: #Pt #px #percent #EM #Размер шрифта #CSS #против #разработка веб-сайтов
-
Оптимизация Пк: Аппаратное Решение
19 Oct, 24 -
Тегеран
19 Oct, 24 -
Геймдизайнер: Модель Для Сборки
19 Oct, 24 -
Правила Хороших Манер При Работе В Фотошопе.
19 Oct, 24 -
Ноутбук Без Аккумулятора?
19 Oct, 24 -
Точно Выделяйте Края Изображений
19 Oct, 24 -
Myspace Дублирует Функциональность Youtube
19 Oct, 24
