正则批量替换px易出错，因会误改URL、注释等非数值px，且未除以根字号基准；应匹配“符号后数字+px”如([ :\(,])(-?\d+)(px)，替换为$1($2/40)rem。
为什么正则批量替换 px 容易出错
直接用正则把所有 px 换成 rem 会破坏单位语义，比如 background: url(img.png) 里的 px（根本不存在）或 10px 被误替换成 10rem（没除基准值），结果样式全乱。真正要替换的是「带数字的 px 单位值」，且必须参与计算（即除以根字号大小）。
安全匹配 px 值的正则表达式怎么写
推荐这个模式：([ :\(,])(-?\d+)(px)，它能准确捕获空格、冒号、左括号、逗号后紧跟的数字 + px，避免匹配 URL、注释或属性名中的干扰项。
替换时用：$1pxTorem($2px)（配合 Sass 函数）或 $1($2 / 40)rem（硬编码基准为 40px）。
-
40是常见基准（对应html { font-size: 40px; }），若项目用100px或75px，记得同步改分母 - 负值如
-10px会被正确捕获，$2包含负号，无需额外处理 - 不匹配
1.5px或10.2px—— 若需支持小数，把\d+改成\d*\.?\d+，但多数 rem 方案只接受整数设计稿值
Sublime 中执行正则替换的关键操作
在 Sublime Text 中打开 CSS 文件 → Ctrl+H（Windows/Linux）或 Cmd+H（macOS）→ 勾选 .*（正则模式）→ 输入查找和替换内容 → 点击 Replace All。
立即学习“前端免费学习笔记（深入）”；
注意这几点：
- 务必先用
Find All预览匹配项，确认没误伤max-width: 100%这类不含px的行 - 如果文件里混有内联
属性（如 HTML 中），需额外开启in selection或手动限定范围，否则可能污染非 CSS 上下文 - 替换后立即编译 Sass 或检查浏览器渲染，因为
pxTorem(10px)这类函数调用必须确保已定义且无拼写错误
比正则更稳的替代方案：用 cssrem 插件实时换算
正则适合一次性迁移老项目；日常开发中，cssrem 插件更可靠——它只对光标所在数字触发换算，且自动按配置的 px_to_rem 值计算，不依赖全局搜索上下文。
安装后关键配置项必须检查：
-
"px_to_rem": 40—— 和你实际设置的html { font-size: 40px; }严格一致，差 1 都会导致布局偏差 -
"available_file_types"至少包含".css"，若在.vue或.html里写内联样式，得手动加进去 - 插件默认不处理
@media查询内的px，如需支持，得确认插件版本 ≥ v1.6（旧版会跳过媒体查询块）
最常被忽略的是：改完 Settings-user 后没重启 Sublime，导致配置不生效 —— 这个动作不能跳过。
