Есть ли практические причины использовать "em" вместо единиц размера шрифта "pt"?

Одно правило CSS, которое я узнал, заключается в том, что вместо абсолютного "pt" вы должны использовать относительную "em" размер шрифта. Общая идея состоит в том, чтобы установить размер шрифта в теге тела, например. "94%", а затем установите все остальные элементы с размером "em" , как это. Обоснование:

  • вы можете изменить относительный размер всех размеров шрифта на вашем сайте, изменив размер шрифта тела в одну точку.
  • сами пользователи могут изменять размер шрифтов, так как они определены в "em"

Однако при использовании "em" вместо "pt" я постоянно сталкиваюсь с такими проблемами, как следующий элемент, когда элемент с размером шрифта внедряется в другой элемент с размером шрифта и, таким образом, становится крошечным (в случае ниже один словарное слово -.8 из .8, а другое -.8 из 1.2).

<html>
<head>
    <style type="text/css">
        body {
            font-size: 94%;
        }
        p {
            font-size: .8em;
        }
        li {
            font-size: 1.2em;
        }
        .vocabulary {
            font-size: .8em;
        }
    </style>
</head>
<body>
    <p>This is an <span class="vocabulary">egregious</span> test.</p>
    <ul>
        <li>This is in a <span class="vocabulary">superb</span> list.</li>
    </ul>
</body>
</html>

Конечно, на очень простых, прямолинейных HTML-сайтах это не проблема, но в реальном мире с импортированными таблицами стилей, которые, возможно, вы даже не делали, и с динамическими сайтами, где элементы управления встроены в другие элементы управления, все из которых выводят HTML с возможно встроенным стилем, я считаю, что сайты с размерами шрифтов "em" иногда невозможно поддерживать, а способ получить размер шрифта под управлением - просто преобразовать все в жесткие "px".

Кроме того, я просто проверил четыре основных браузера, и каждый из них имеет горячие клавиши, которые увеличивают и уменьшают размер шрифтов "pt".

Итак, вот мои вопросы:

  • Есть ли какая-то реальная причина, почему я должен использовать "em" вместо "pt"?
  • Есть ли смысл использовать размеры "em" , чтобы я не сталкивался с проблемой встроенного размера шрифта выше?

Ответы

Ответ 1

В зависимости от страны, где вы живете, на самом деле вы можете нарушить закон, используя pt вместо em, в зависимости от того, насколько жестко ваш законодательный орган хочет применять правила. Здесь, в Великобритании, существует акт дискриминации по признаку инвалидности, который использовался для того, чтобы ориентировать компании, где их веб-сайты были предоставлены фиксированным шрифтом. Это рассматривается как дискриминация, потому что недостатки частично помещены, которые, возможно, увеличили размер шрифта браузера, чтобы компенсировать - но ваш сайт по-прежнему отображает шрифты с установленным вами размером, а не размером, который они ожидали бы.

Да, сложнее справиться с относительными размерами шрифтов и макетами жидкостей, но если вы хотите соблюдать законодательство, вы должны потратить время, чтобы справиться с этим.

Для работы локальных органов власти в Великобритании были установлены целевые показатели, обеспечивающие соответствие веб-сайтов рекомендациям Double A, в одном из которых говорится: "Используйте относительные, а не абсолютные единицы в значениях атрибутов языка разметки и значения свойств таблицы стилей". См. здесь.

Ответ 2

Даже если вы жестко закодируете размер шрифта в пикселе, вы все равно можете использовать em для единицы, чтобы указать маржу, длину и т.д., аналогично использованию em quad, чтобы в любом случае сделать абзац в печатной машине.

Изменить (после того, как плакат изменился с px на pt): Если вы хотите быть "идеальным пикселем", безопаснее идти с px, а не pt, так как у разных операционных систем разные настройки dpi, а изменение пользовательских изменений в dpi, особенно в Linux. Точка PostScript определяется как 1/72 дюйма. "Дюйм" на экране может находиться где угодно между 72 пикселями и тем, что плавает ваша лодка.

Ответ 3

Из моего опыта использования веб-пользователей, которым нравится большой текст:

Задание "pt" для размеров шрифтов в порядке, если вы не укажете размеры элементов в px/pt. Потому что, когда вы это делаете, и я увеличиваю размер текста, половина текста переполняет элемент, и слишком часто переполнение становится скрытым.

Это не нужно искажать макет - просто оставите место для того, чтобы все стало расти. Я могу обрабатывать прокрутку страницы лучше, чем я не вижу текст.

Ответ 4

1) IE6 по-прежнему широко используется и не может изменять размеры шрифтов, определенных в px. = > Вопросы юзабилити. Это само по себе не-нет.

2) См. CSS Units, например.

3) Большинство авторов соглашаются сказать, что pt - это в основном печатный блок: в худшем случае используйте их в листах стилей печати, где проблема изменения размера исчезает...

Ответ 6

px: изменения с разрешением экрана и другими зависимыми проблемами

em: независимо от вашего разрешения экрана, он будет таким же для всех

Ответ 7

Некоторые профессиональные разработчики CSS, которые, как я знаю, используют "px" для определения размеров шрифтов в их основной таблице стилей для современных браузеров, а затем имеют отдельную таблицу стилей для IE6, которая определяет их с использованием относительных единиц. Таким образом, они обеспечивают удобство использования и позволяют увеличивать шрифт во всех браузерах, но без необходимости компрометации их дизайна в современных браузерах.

(Они на самом деле идут дальше: их таблица стилей IE6 отключает большинство форматирования блоков и просто выкладывает все, используя общий, мобильный вид. Таким образом, пользователи IE6 могут видеть простой макет, а все остальные получают профессиональный вид где блоки фактически плавают правильно.)