【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 
我听说你应该使用em而不是像素来定义样式表中的大小和距离。 所以问题是为什么在css中定义样式时我应该使用em而不是px？ 有一个很好的例子可以说明这一点吗？
#1楼
顶部投票答案在这里从thomasrutter是正确的，他对EM响应。 但是像素的大小是非常错误的。 所以即使它已经老了，我也不能让它变得不成熟。
电脑屏幕通常不是96dpi！ （或者ppi，如果你想变得迂腐。）
像素没有固定的物理尺寸。
（是的，它仅在一个屏幕内固定，但在下一个屏幕中，像素很可能更大或更小，当然不是1/96英寸。）
证明
画一条线，长960像素。 用物理标尺测量它。 是10英寸？ 没有..？
将笔记本电脑连接到电视。 线路现在是10英寸？ 还没有？
在iPhone上显示该行。 还是一样大小？ 为什么不？
谁发明了96dpi电脑屏幕神话？
（有些宗教以72dpi神话运作。但同样错误。）
#2楼
例：
代码：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 {font-size：2em;} // 20px
...
身体
1
2
3
4
五
通过改变身体中的值，其余的自动变化是基数值的一种...
10×2 = 20 10×1.6 = 16等
您可以将基值设置为8px ...所以8×2 = 16 8×1.6 = 12.8 //可以通过浏览器舍入
#3楼
如果您想使用px指定字体大小，但仍然希望通过将其放在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 */
}
等等。
#4楼
它适用于必须根据字体大小进行缩放的所有内容。
它在通过缩放字体大小实现缩放的浏览器上特别有用。 因此，如果使用em所有元素的大小，则会相应地缩放。
#5楼
使用px精确放置图形元素。 使用em进行测量，必须在文本元素周围进行定位和间距，如行高等.px是像素精确的，em可以随着使用的字体动态变化
来源：oschina
链接：https://my.oschina.net/stackoom/blog/3145737