修改 bootstrap 5 断点必须重编译 sass：覆盖 $grid-breakpoints 和 $container-max-widths 变量并确保构建流程正确加载，cdn 用户无法修改。
修改 Bootstrap 5 的断点配置必须重编译 Sass
Bootstrap 5 默认的断点（xs、sm、md、lg、xl、xxl）不是运行时可配的，改 $grid-breakpoints 变量后不重新编译 CSS 就无效。直接在 HTML 里加 class="d-lg-none" 这类类名，用的永远是原始断点值。
- 必须从源码的
scss/_variables.scss或自定义变量文件中覆盖$grid-breakpoints，例如：$grid-breakpoints: ( xs: 0, sm: 480px, md: 768px, lg: 1024px, xl: 1440px );
- 确保你的构建流程（如 Webpack + sass-loader 或 Dart Sass CLI）能识别并加载这个变量文件，且顺序在
bootstrap/scss/bootstrap.scss之前 - 如果只引入了 Bootstrap 的 CSS CDN，任何 Sass 变量修改都完全不起作用
断点命名和数值必须严格匹配媒体查询逻辑
改完数值后，类名行为可能“看起来不对”，比如 col-md-6 在 768px 下没生效——大概率是断点映射关系被破坏了。Bootstrap 的栅格类依赖 $grid-breakpoints 和 $container-max-widths 两个变量联动，且所有断点键名（sm、md 等）必须一致。
-
$grid-breakpoints定义的是「最小宽度触发」，即@media (min-width: 768px)对应md，不是“最大宽度” - 如果删掉
xl键，但模板里还写了col-xl-4，该类会彻底消失（不会 fallback 到lg） -
$container-max-widths必须同步更新，否则.container在对应断点下宽度错乱
JavaScript 组件对断点的硬编码引用极少，但需留意 Offcanvas 和 Navbar
绝大多数 JS 组件（如 Modal、Toast）不读取断点变量，但 Offcanvas 的 breakpoint 选项和 Navbar 的折叠逻辑会按名称查 $grid-breakpoints。如果你把 lg 改成 992px，又在 HTML 写 data-bs-breakpoint="lg"，它就真按 992px 切换。
-
Offcanvas的breakpoint值必须是$grid-breakpoints中存在的键名，不能写像素值 -
Navbar的.navbar-expand-{breakpoint}类行为完全由 CSS 媒体查询驱动，JS 不干预，所以只要 CSS 编译正确，JS 部分无需改动 - 第三方插件（如某些 Bootstrap 表单验证库）一般不依赖断点，但自定义响应式逻辑的业务代码要检查是否硬编码了
768、992这类数字
Bootstrap 4 和 5 的断点处理差异容易混淆
如果你是从 v4 升级或混用文档，注意 v4 的 $grid-breakpoints 默认包含 xs（但值为 0），而 v5 明确移除了 xs 键——不过实际使用中 col-6 仍等价于 col-xs-6。这不是 bug，是 v5 把 xs 逻辑内联到无前缀类名中了。
- v5 中删掉
xs键不会影响col-6，但会影响text-xs-center这类已废弃的旧类（v5 早就删了） - v4 的
$grid-float-breakpoint（控制浮动栅格的临界点）在 v5 中已被移除，相关逻辑合并进$grid-breakpoints - 别在 v5 项目里抄 v4 的变量覆盖写法，比如继续声明
$grid-float-breakpoint，它会被忽略且不报错
