Одно правило CSS, которое я узнал, состоит в том, что вы должны использовать относительную единицу размера шрифта em вместо абсолютного pt. Общая идея состоит в том, чтобы установить размер шрифта в вашем теге body, например. "94%", а затем установите все остальные элементы с размером "em", как это. Аргументация:
- затем вы можете изменить относительный размер всех размеров шрифта на вашем сайте, изменив размер шрифта тела в одной точке
- Пользователи сами могут изменять размер шрифтов, так как они определены в «em»
Однако при использовании «em» вместо «pt» я постоянно сталкиваюсь с такими проблемами, как следующие: элемент с размером шрифта внедряется в другой элемент с размером шрифта и, таким образом, становится крошечным (в случае ниже одного словарное слово 0,8 из 0,8, а другое 0,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", чтобы я не столкнулся с проблемой размера встроенного шрифта выше?