改$grid-gutter-width无效是因为它仅用于初始化$gutters map，不直接影响运行时样式；必须重编译并确保变量声明在所有@import之前，且调用generate-gutter-classes()生成新类。
改 $grid-gutter-width 只在 sass 编译项目里有效，cdn 或直接引入 bootstrap.min.css 的项目改了也白改。
为什么改了 $grid-gutter-width 页面没变化
Bootstrap 5.3+ 的 $grid-gutter-width 已降级为“初始化用途”——它只参与生成 $gutters map 的默认值，不控制任何运行时行为。所有 gx-* 类（如 gx-3）的尺寸都来自编译时固化进 CSS 的 $gutters map，不是靠读取变量实时计算的。
- 你改了
$grid-gutter-width: 1.5rem，但没重跑@include generate-gutter-classes()，新类名压根不会出现在输出 CSS 里 - 即使改对了，若
@import "bootstrap/scss/bootstrap"写在变量覆盖之后，旧值仍被使用 - 用 CDN 加载的 CSS 文件里，
$grid-gutter-width不暴露、不可覆盖，JS 或:root都拿它没办法
gx-* 类才是真正在运行时起效的控制点
所有 gx-*、gy-*、g-* 工具类，本质是给 .row 设置 --bs-gutter-x 或 --bs-gutter-y 自定义属性，优先级高于全局变量，且无需编译。
-
gx-0：彻底清空水平 gutter（同时重置.row的负 margin 和.col的 padding） -
gx-md-2：仅从md断点（≥768px）起生效，值为0.5rem（对应$gutters: (2: 0.5rem)） -
gx-sm-3 gx-lg-4：小屏用 1rem，大屏升到 1.5rem；后声明的断点规则会覆盖前面的 - 别用
px-*替代——它只动.colpadding，不碰.rowmargin，布局必然失衡
想全局统一改默认间距，必须重编译且顺序不能错
如果项目几十个 .row 都要统一设成 12px 水平间距，才值得动变量。但三件事漏一不可：
- 确保构建流程真正调用了完整 Bootstrap SCSS 入口（比如显式
@import "bootstrap/scss/grid"，而非只 import 部分模块） -
$grid-gutter-width: 0.75rem必须写在所有@import语句之前，且在@import "bootstrap/scss/variables"前就已声明 - 若自定义了断点（如新增
xl2: 1400px），必须同步在@include generate-gutter-classes()前声明$grid-breakpoints，否则gx-xl2-3这类类名不会生成
最常被忽略的一点：局部调整永远优先用 gx-* 类；只有当设计规范要求全站 gutter 统一且长期稳定时，才碰变量——而一旦碰，就得接受整套 Sass 构建流程的约束，不是改个数字就能跑起来的事。
