为什么在css中使用em作为边距或填充单元？

Question

我知道使用em作为font-size单位的原因，它总是在响应式设计教程中讨论。

但在某些网站中，我发现他们也使用em作为margin或padding甚至width的单位。我知道为什么他们不想在px中修复它，但为什么只使用百分比单位作为流体布局呢？

使用em带来的好处是什么？

Answer 1

假设您查看样式表并在px中找到50种不同的字体大小声明。当屏幕尺寸发生变化时，您需要通过media query更改字体大小的50个位置。这是50个吸吮点。

首先，除了最庞大的网站之外，所有50个地方都是太多了。但是，让我们说这50个地方都在他们身上。现在通过媒体查询，您只需要更改正文中的字体大小，并且该更改将在文档中一直级联并相应地调整大小。

本文的片段，更有用，更好地解释了here

Answer 2

通过在ems中指定填充宽度，填充的宽度相对于div元素的字体大小。

因此，当元素的字体大小增加并且元素周围的填充也应该增加时，这很有用。

EM是一个相对单位，作为一般规则，相对单位用于长度而不是绝对长度。

Answer 3

据我所知，使用em的好处是它会根据font-size而增加。

如果你提供增加字体大小的功能，在某些情况下你会希望你的填充更大，以便为视力不佳的人提供更好的清晰度。

如果您不使用 SASS 或 LESS 之类的其他好处，您可以定义一个基本值，其他人用来计算它们。这样你就可以只在一个地方改变一切。