<p>Less中unit()函数不能直接做px转rem换算，它仅剥离或重设单位而不参与计算；正确做法是用除法配合基准变量（如@base-font-size: 16px）实现动态转换，公式为(@px / @base-font-size) * 1rem。</p>
Less中unit()函数不能直接做px转rem换算
unit()只是剥离或重设数值的单位，它不参与计算逻辑。比如unit(16px, rem)结果是16rem，不是1rem。想实现「px → rem」动态换算，必须先除以根字体大小（如16px），再套unit()加单位——但更常见、更安全的做法是根本不用unit()，直接用除法+单位拼接。
正确做法：用除法配合变量定义基准值
rem的本质是“相对于根元素font-size的倍数”，所以转换公式就是：value / base-font-size。把基准值抽成变量，后续调整只需改一处：
@base-font-size: 16px;
<p>.px-to-rem(@px) {
font-size: (@px / @base-font-size) * 1rem;
}</p><p>.example {
.px-to-rem(14);
// 编译后：font-size: 0.875rem;
}- 必须确保
@px带单位（如14px），否则除法会报错Operation on an invalid type - 如果传入无单位数字（如
14），得先用unit(@px, px)补单位，但容易漏，不推荐 - 不要写成
(@px / @base-font-size)rem——Less会把它当成一个整体标识符，编译失败
为什么不用unit(@px / @base-font-size, rem)？
因为@px / @base-font-size结果是纯数字（如0.875），而unit(0.875, rem)输出的是0.875rem——看似可行，但实际掩盖了两个风险：
- 如果
@px本身是14em这类非px单位，除法仍会执行但语义错误，unit()不会报警 - Less 3.5+ 对
unit()处理浮点数有精度问题，某些版本下unit(16px / 16px, rem)可能产出1.0000000000000002rem - 可读性差：看到
unit(..., rem)得倒推前面是不是做了除法，不如直接写* 1rem直白
上线前务必检查HTML根字体是否真为16px
Less里算出1rem = 16px只是假设。如果项目用了动态根字体（如通过JS设置document.documentElement.style.fontSize = '18.75px'），那所有rem值都会偏大。此时要么：
立即学习“前端免费学习笔记（深入）”；
- 改Less变量
@base-font-size匹配运行时值（需构建时注入） - 放弃rem，改用
clamp()或vw响应式方案 - 在CSS里用
html { font-size: calc(100vw / 750 * 16); }这类兜底（750是设计稿宽度）
单位换算从来不是纯编译期问题，根字体的实际值才是最终决定因素。
