Что такое "em", если размер шрифта документа указан в ems?
в CSS,em
- относительная единица, основанная на размере шрифта документа. Итак, что же такое em
тогда, если размер шрифта в документе измеряется в ems? Предположим, мы скажем:
<style type = "text/css">
body
{
font-size: 1em;
}
</style>
так,em
теперь рекурсивно определенными. Так как это обрабатывается браузером?
на W3C по документам говорят:
единица измерения 'em' равна вычисленному значению 'размера шрифта' собственность элемент, на котором он используется. Исключение составляют случаи, когда 'em' встречается в значении самого свойства' font-size', в котором случае это относится к размеру шрифта родительского элемента. Он может быть использован для вертикального или горизонтального измерения. (Этот блок также иногда называется quad-width в типографских текстах.)
но что, если элемент document.body
, значит, родительского элемента нет?
3 ответов
body
не является корневым элементом документа - это очень распространенное заблуждение. Родительский элемент body
is html
, размер шрифта по умолчанию которого совпадает с настройкой размера шрифта по умолчанию браузера (обычно 16px
).1
это применимо, даже если вы установили font-size
значение в ems on и body
и html
. Поэтому если вы сделали это:
html, body { font-size: 2em; }
тогда, предполагая размер шрифта по умолчанию 16px
как, html
будет размер шрифта 32px
(дважды размер шрифта по умолчанию) и body
будет иметь размер шрифта 64px
(дважды своего родителя, html
).
1если быть точным, то html
размер шрифта элемента по умолчанию -начальное значение, medium
, который согласно спецификации соответствует предпочтительному размеру шрифта по умолчанию, установленному пользователем.
Он будет принимать значение по умолчанию браузеров 16px, если ни один родительский элемент не определил его.
Также см. Это:http://pxtoem.com/
Это будет относительно любого размера шрифта браузера по умолчанию, который будет указан в физическом размере, например "10pt".