$var / 1px 是最稳妥的去单位方法，利用单位约分规则将带单位值转为纯数字，比 unitless() 更简洁、比 strip-unit() 更可靠，但需确保左右操作数单位匹配且必要时加括号避免解析歧义。
直接结论：用 $val / 1px 是最稳妥的“去单位”手段，比 unitless() 判断后分支处理更简洁，也比已弃用的 strip-unit() 更可靠。
为什么 $val / 1px 能安全去单位
SCSS 允许同单位相除得到无量纲数字，32px / 1px 的结果就是 32（纯数字），不报错、不依赖函数、不引入额外逻辑。它本质是利用单位约分规则，不是“黑魔法”，而是 SCSS 单位系统设计的一部分。
常见错误是写成 32px / 16（右边无单位）或 32 / 16px（左边无单位）——这会触发 Operation on an invalid type，因为单位不匹配无法约简。
-
$px: 24px; $num: $px / 1px;→$num是24（可参与后续除法算 rem） -
$px: 14; $num: $px / 1px;→ 报错！纯数字不能除以带单位值，得先兜底：@if unitless($px) { $px: $px * 1px; } - 别用
unit($px, '')：SCSS 3.5+ 已移除该写法，unit()只读，不改值
除法运算必须加括号的三种典型场景
Sass 解析器看到 / 时，默认优先按 CSS 分隔符处理（比如 font: 14px/1.5），除非你明确告诉它“这是算术”。括号是最直白的信号。
立即学习“前端免费学习笔记（深入）”；
- 变量在右边：
width: $container / 3;→ 必须写成width: ($container / 3);，否则可能被当 CSS 语法解析失败 - 字面量混合单位：
line-height: (1.5 / 1);→ 输出1.5；不加括号会崩 - 涉及插值：
margin: calc(#{math.div($gap, 2)} - 1px);→ 先由 Sass 算出10px，再拼进 calc，避免在 calc 内部做无效运算
rem 转换函数里最容易漏掉的对齐细节
SCSS 算出来的 rem 值（比如 24px / 16px → 1.5rem）必须和 JS 运行时设置的根元素 font-size 完全一致，否则页面会错乱。这不是 SCSS 的问题，而是环境脱节。
- 推荐用
@mixin rem($prop, $px)替代独立函数：支持多属性批量输出，还能加@if判断是否启用 rem - 根字号若动态变化（如根据 dpr 或屏幕宽度调整），SCSS 编译期无法感知，此时 rem 计算就失效，应改用
calc(100vw / 375 * 16px)类方案 - 传入纯数字（如
14）时，函数内部要自动补px：@if unitless($px) { $px: $px * 1px; }，否则下游$px / 16px会因类型不一致中断
单位运算不是写完就跑通的事——它卡在编译期，报错信息又常误导人。最危险的不是不会写，而是写了看似能编译，但生成的 CSS 在浏览器里根本没生效，还查不出原因。
