round() 的四种取整策略，以及 mod 与 rem 的区别
round(策略, 值, 步距) 把值取整到步距的整数倍上。四种策略 up / down / nearest / to-zero 恰好对应 JS 的 Math.ceil / floor / round / trunc（作用于「值 ÷ 步距」）。正数区它们相差不大，差异全在负数: up 朝
+∞（负数反而变大）、down 朝 −∞、to-zero 朝零——把值拖到负区，在数轴上观察四个标签如何分开。本页所有结果都是真 CSS 算的（探针元素 + getComputedStyle）, JS 只做对照。
nearest 的平手规则： 值正好卡在两个倍数中间时 (如 round(-62.5px, 25px))，取更大的那个（朝 +∞），和 JS 的 Math.round(-2.5) === -2 一致。另注意第一个参数是关键字不是字符串，写 round("up", …) 反而非法。
1 · mod() 与 rem(): 余数的符号跟谁
两个都是求余，被除数和除数同号时结果完全一样；异号时分家：mod() 的结果符号跟除数（数学上的 modulo）, rem() 跟被除数 (remainder)。JS 的 % 是 rem 派——所以 JS 里 -70 % 30 === -10，要「环回到正区间」得手写
((a % b) + b) % b，而 CSS 直接给了 mod()。
2 · 实战：把任意宽度吸附到 8px 网格
设计系统常要求尺寸落在 4px / 8px 网格上。来源不可控的宽度（内容撑的、比例算的），一层 round(宽, 8px) 就能吸附上去——灰色细条是原始宽度，橙色条是吸附后的。
3 · 特殊值实测：步距为 0 / 无穷会怎样
步距给 0 数学上是 NaN，但 CSS 不允许 NaN 逃出顶层计算——规范规定顶层 NaN 替换为 +∞；而一个 +∞ 的长度最终落为什么数，由属性的取值范围与各实现的钳制决定。与其记忆表格，不如让当前浏览器实际算给你看：
一句话： 取整选 round() 并想清楚负数走向；「环回」用 mod()（符号跟除数），「截余」用 rem()（符号跟被除数，即 JS 的 %）。
4 · 🔗 相关链接
- round() · developer.mozilla.org——本页主要来源：四种策略的定义、负数行为与特殊值表格。Baseline 2024。
- mod() 与 rem() · developer.mozilla.org——两个求余函数的符号规则对照，rem() 页由此互链。