例子：

代码：body｛font-size:10px；｝//保持10以下所有大小正确，更改此值，其余更改为该值的1.4

1｛font-size:1.2em；｝//12px

2｛font-size:1.4em；｝//14px

3｛font-size:1.6em；｝//16px

4｛font-size:1.8em；｝//18px

5｛字体大小：2em；｝//20px

…

body

1

2

3

4

5

通过改变身体中的值，其余部分会自动改变为基础值的一倍…

10×2=2010×1.6=16等

你可以将基值设为8px…所以8×2=168×1.6=12.8//可由浏览器舍入

使用em或百分比的主要原因是允许用户在不破坏设计的情况下更改文本大小。如果您使用以px指定的字体进行设计，则如果用户选择文本大小更大，字体大小不会改变（在IE 6和其他浏览器中）。这对于有视觉障碍的用户来说非常糟糕。

有关此类设计的几个例子和文章（有无数可供选择），请参阅最新一期的“a List Apart：Fluid Grids”，旧一期的文章“How to Size Text in CSS”或Dan Cederholm的防弹Web Design。

您的图像仍然应该以像素大小显示，但通常情况下，用像素大小显示文本被认为是不好的形式。

尽管我个人很鄙视IE6，但它目前是《财富》200强公司中唯一一款被大多数用户认可的浏览器。

在IE6（从您的网站上）消失之前，您可能希望使用em作为字体大小。当页面缩放（与文本缩放相反）成为标准行为时，Px将正常。

Trainfamer已经提供了必要的链接。

像素是绝对单位，而rem/em是相对单位。更多信息：https://drafts.csswg.org/css-values-3/

当您希望字体大小根据系统的字体大小进行调整时，应使用相对单位，因为系统将字体大小值提供给根元素（即HTML元素）。

在这种情况下，如果网页在Google Chrome中打开，HTML元素的字体大小由Chrome设置，请尝试更改它，以查看使用rem/em单位字体的网页的效果。

如果使用px作为字体单位，字体将不会调整大小，而使用rem/em单位的字体将在更改系统字体大小时调整大小。

因此，如果您希望大小固定，请使用px；如果您希望系统大小自适应/动态，请使用rem/em。

如果您想使用px来指定字体大小，但仍然希望em通过将其放在CSS文件中提供可用性，那么有一个简单的解决方案：

body {
  font-size: 62.5%;
}

现在指定p（和其他）标记如下：

p {
  font-size: 0.8em; /* This is equal to 8px */
  font-size: 1.0em; /* This is equal to 10px */
  font-size: 1.2em; /* This is equal to 12px */
  font-size: 2.0em; /* This is equal to 20px */
}

等等

一个非常实际的原因是，如果使用px指定字体，IE6不允许您调整字体大小，而如果使用em或百分比等相对单位，则可以调整字体大小。不允许用户调整字体大小对可访问性非常不利。尽管它在下降，但仍有很多IE 6用户。