rem单位
rem 是 CSS 的相对长度单位，全称 root em。它的取值始终以根元素（即 <html>）的 font-size 为基准。浏览器默认根字号为 16px，因此在不做任何设置时 1rem = 16px。它最容易被拿来和 em 混淆：em 以当前元素自身的字号为基准（当用于 font-size 属性时则参照父元素），而 rem 只认根元素，这是两者的根本区别。
正因为 rem 永远只参照根元素，不管标签嵌套多深，1rem 换算出的像素值都一样，避免了 em 层层相乘导致的"复合放大"问题。它的典型用途包括：
- 响应式布局：只需改动一处
html的font-size，整页基于rem的尺寸就会等比缩放； - 无障碍：
rem会跟随用户在浏览器里调大的默认字号，比写死px更友好。
使用要点与常见误区：常见技巧是给 html 设 font-size: 62.5%，让 1rem ≈ 10px，换算更直观；不要把 em 当成 rem，em 受最近祖先字号影响，嵌套时容易失控；移动端做等比适配时，rem 常配合 JS 或 vw 动态设置根字号；而需要精确像素（如 1px 边框）时直接用 px 即可，不必强行改成 rem。
常见问题
rem 和 em 有什么区别？
rem 以根元素 <html> 的字号为基准，全页统一；em 以当前元素自身（用于 font-size 属性时为父元素）的字号为基准，嵌套时会逐层累积放大。因此 rem 更可控，em 更适合需要相对父级缩放的局部场景。
1rem 等于多少像素？
取决于根元素 <html> 的 font-size。浏览器默认是 16px，所以默认情况下 1rem = 16px；如果把 html 设为 font-size: 10px，则 1rem = 10px。
为什么很多人给 html 设 font-size: 62.5%？
因为 16px × 62.5% = 10px，这样 1rem 就正好等于 10px。之后写 1.6rem 即 16px、2.4rem 即 24px，心算换算更方便。