单位
px
px 像素（Pixel）。相对长度单位。像素 px 是相对于显示器屏幕分辨率而言的。
em
em 是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。
rem
rem 是 CSS3 新增的一个相对单位（root em，根 em），这个单位引起了广泛关注。
这个单位与 em 有什么区别呢？区别在于使用 rem 为元素设定字体大小时，仍然是相对大小，但相对的只是 HTML 根元素。
这个单位可谓集相对大小和绝对大小的优点于一身，通过它既可以做到只修改根元素就成比例地调整所有字体大小，又可以避免字体大小逐层复合的连锁反应。
rem 的兼容方案
目前，除了 IE8 及更早版本外，所有浏览器均已支持 rem。对于不支持它的浏览器，应对方法也很简单，就是多写一个绝对单位的声明。这些浏览器会忽略用 rem 设定的字体大小。下面就是一个例子：
p {
font-size: 14px;
font-size: 1.4rem;
}
选择
目标用户是 PC 的页面可以使用 px；目标用户是移动端的使用 rem；而 em 可以在局部使用，比如 small。upper 等元素。
如果不确定怎么使用，可以参考成熟的框架，比如 bootstrap 5。
最佳实践
任意浏览器的默认 font-size 都是 16px。
为了方便换算，我们一般将根元素 html 的字体大小设置为 62.5%，也就是 1rem = 16px*62.5% = 10px。那么 12px=1.2rem, 14px=1.4rem, 可以方便地计算出相对值。
html {
font-size: 62.5%;
}
p {
font-size: 14px;
font-size: 1.4rem;
}