什么是“em”如果文档的字体大小在ems中指定？ [英] What is an "em" if the font-size of the document is specified in ems?

问题描述

在CSS中， em 是基于文档的字体大小的相对单位。那么，如果文档的字体大小本身是在ems中测量的，那么 em 究竟是什么？假设我们说：

 < style type =text / css> 
 body 
 {
 font-size：1em; 
} 
< / style> 
  

现在递归定义 em 。那么这是如何由浏览器处理的？

W3C docs 说：

'em'单位等于'font-size'的计算值
其使用的元件的性质。例外是当
'em'出现在'font-size'属性本身的值中时，
case表示父元素的字体大小。它可以用于
用于垂直或水平测量。 （此单元有时也是
，在印刷文本中称为四边形宽度。）

但是如果元素 document.body ，因此没有父元素？

解决方案

body 不是文档根元素 - 这是一个很常见的误解。 body 的父元素为 html ，其默认字体大小与浏览器的默认字体大小设置（通常 16px ）。 ¹

即使您设置了 -size 的值 body 和 html 。所以，如果你这样做：

  html，body {font-size：2em; } 
  

然后，假设默认的字体大小 16px 由用户设置， html 将具有 32px （默认字体大小的两倍）的字体大小， body 的字体大小为 64px （父级的两倍， html ）。

---

¹ _{c $ c> html 元素的默认字体大小为初始值 medium ，其根据规范对应于由用户设置的优选默认字体大小。} p>

In CSS, an em is a relative unit based on the font-size of the document. So, what exactly is an em then, if the font-size of the document itself is measured in ems? Suppose we say:

<style type = "text/css">
body
{
    font-size: 1em;
}
</style>

So, an em is now recursively defined. So how is this handled by the browser?

The W3C docs say:

The 'em' unit is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element. It may be used for vertical or horizontal measurement. (This unit is also sometimes called the quad-width in typographic texts.)

But what if the element is document.body, so there is no parent element?

解决方案

body is not the document root element — that's a very common misconception. The parent element of body is html, whose default font size matches the browser's default font size setting (typically 16px).¹

This applies even if you set a font-size value in ems on both body and html. So if you did this:

html, body { font-size: 2em; }

Then, assuming a default font size of 16px as set by the user, html will have a font size of 32px (twice the default font size) and body will have a font size of 64px (twice of its parent, html).

---

¹ _{To be precise, the html element's default font size is the initial value, medium, which according to the spec corresponds to the preferred default font size as set by the user.}

这篇关于什么是“em”如果文档的字体大小在ems中指定？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！