ems是否仍然相关？

Question

我从像这一个这样的线程中了解到，ems的目的是定义网页中的所有度量，通过基本字体大小来定义，这可以由浏览器来设置。

例如，在Chrome中，您可以通过使用settings -> show advanced settings -> web content -> font size: very large来实现这一点。我可能会这样做，如果我使用的是一个大的，高分辨率的显示器，那是遥远的。

我创建了一个柱塞，它演示了ems和px在调整大小方面的差异。

#div1 {
  width: 320px
}

#div2 {

  width: 20em;
}

如果在我的浏览器中将字体大小设置为中等，这些div将是相同的大小，基本字体大小为16 so，所以20em =320 so。

但是，当我将浏览器字体大小更改为非常大时，我们可以看到ems中测量的div增大了大小。

但是，如果我在body标记中定义字体大小，则此效果将被否定。

body {
  font-size: 16px;
}

因为现在我的css正在覆盖浏览器设置的字体大小。

我知道ems在旧浏览器中是很重要的，在旧浏览器上放大页面只会增加字体。但如今，现代浏览器同时增加了像素和字体，使得缩放问题变得毫无意义。

环顾网络-很多网站都会在自己的身体标签中设置字体大小。

堆栈溢出，例如，将正文标记中的字体大小设置为13 to。在我的浏览器中设置字体大小不会影响堆栈溢出的布局。

谷歌搜索结果并不能做到这一点。

(这两个屏幕截图的铬字体大小设置为非常大，并100%缩放)。

因此，您可能会认为在body标记中设置字体大小是个坏主意，因为它阻止了用户自己的可访问性设置。但是，考虑到用户可以放大大小(按比例增加所有像素)，这似乎不是一个真正的问题。

Answer 1

但是，如果我在body标记中定义字体大小，则此效果将被否定。body {字体大小:16 by；}因为现在我的css正在覆盖浏览器设置的字体大小。

你忘记了可访问性。

请参阅指南(WCAG2.0)中的C14:使用em单位表示字体大小。

将浏览器的字体大小选项设置为非常大。现在转到像W3C这样的网站。短信看上去怎么样？

这就是这个选项的意义所在。StackExchange和许多其他网站的开发者认为，他们的选择比视障用户的选择更重要。这个选择是对是错不在这个问题的范围之内，答案也不一定是直截了当的。

然而，您可能会被迫(包括法律对某些网站)作出不同的决定，并让用户选择他们的字体大小。在这里，您可以选择:要么指定图像的大小和页面的不同区域(以像素为单位)，在这种情况下，浏览器的字体大小选项将对布局产生有趣的影响，或者对这些元素也使用em。

还请注意，如果您没有在正文级别指定以像素为单位的字体大小，那么至少对于任何地方的字体大小，请坚持使用em。例如，Google不一致地指定字体大小，他们的搜索页面看起来很奇怪，特别是标题看起来比普通文本要小。另一方面，维基百科在指定字体大小时使用em，做得很好。下面是两个站点的屏幕截图，字体大小选项设置为“非常大”：

因此，您可能会认为在body标记中设置字体大小是个坏主意，因为它阻止了用户自己的可访问性设置。但是，考虑到用户可以放大大小(按比例增加所有像素)，这似乎不是一个真正的问题。

这是一个真正的问题，有两个原因。

首先，大多数浏览器逐站点存储缩放因子。如果您有视力障碍，您将被迫放大，一次又一次，在您访问的每个网站。这太糟糕了。鉴于目前网页设计师和开发人员对可访问性的漠不关心，视力受损的人无论如何都必须这样做，但这并不意味着它应该保持这种状态。

第二，太多的网站在缩放时也不会表现得很好。响应网站做得很好，但没有响应的网站会表现出水平滚动或某种“你的屏幕太小”的行为。

对于开发人员来说，缩放和文本缩放也有一个根本的区别。虽然em的意思是“将其调整到用户的文本大小首选项”，但缩放是指向上或向下缩放整个页面，而不仅仅是文本。

举一个站点菜单的例子(在页面顶部，链接位于一行中)。随着缩放，您知道菜单的高度将与其他元素成比例地变化。使用文本大小选项，由您来决定行为。你可能会假设一个视力受损的人在任何情况下都能看到你的50px-height菜单:没有人会错过白色背景下的黑色菜单。或者您可以决定它的高度应该与文本保持成比例，例如1.5em。

Answer 2

ems的目的是根据基本字体大小定义网页中的所有测量值。

这可能是我对术语的误解，但需要澄清的是：em与“当前元素”的字体大小有关。rem相对于根字体大小。

我知道ems在旧浏览器中是很重要的，在旧浏览器上放大页面只会增加字体。

这不是我使用em's的原因。事实上，当我使用相对度量单位时，你的缩放体验是我最不想看到的。我的担忧是两方面的。

首先，我通常感兴趣的只是简单地定义我的布局的相对术语。我担心的是，我的容器之间和里面的文字看起来都很好。当我改变字体或调整链子上的东西时，我不想重新计算和更新所有的东西，以保持我想要的比例。让浏览器做数学计算..。

其次，我只想用我能理解的简单术语来表达字体大小。如果我用pt's‘和其他一切用rem's或em’来表达我的基本字体，对我来说就更容易了。我不需要知道你的设备的分辨率，你也不用放大。你的浏览器知道要使用多少像素，我们两个都不需要考虑这个问题。