REM的基准：基于浏览器默认字号、自定义字体还是固定像素？

嘿，我来给你把这个问题掰扯明白！

首先得明确：rem的计算基准是浏览器根元素（<html>标签）的字号，和你用什么字体、操作系统基本没关系——除非这些因素影响了浏览器的默认根字号，但绝大多数情况下，浏览器默认的根元素字号都是16px，这是行业通用的默认值。

针对你提到的几种情况：

• 以Chrome默认16px为例，不管页面用Segoe UI还是Inter UI，只要没人为修改根元素的字号，1rem就等于16px。字体只是决定文字的渲染样式（比如字宽、字重），不影响rem的计算逻辑。
• rem并不是固定死16像素！如果用户在浏览器里调整了默认字体大小（比如改成20px），或者开发者用CSS代码（比如html { font-size: 18px; }）修改了根元素字号，那1rem就会跟着变成对应的数值。

再说说你测试的Bootstrap 4页面：Bootstrap的Reboot模块默认会把<body>的字号设为1rem，而根元素<html>保持浏览器默认的16px，所以你测量的1em（这里<body>的1em就等于1rem）显示为16px，完全是符合预期的结果。

附上你截取的测试截图：

内容的提问来源于stack exchange，提问作者Daniel Vianna