应通过媒体查询或Sass变量精准控制超大屏容器宽度：Bootstrap 5.3+需用@media (min-width: 1400px)覆盖xxl断点，默认max-width为1320px；Sass项目须在导入variables后、container前用map-merge重定义$container-max-widths。
直接写 .container { max-width: 1400px } 会破坏响应式逻辑，小屏强制撑宽引发横向滚动，大屏又被 Bootstrap 媒体查询覆盖——超大屏宽度必须按断点精准控制。
查清你用的 Bootstrap 版本和 xxl 断点阈值
不同版本的超大屏断点不同，改错数值就白忙：
Bootstrap 5.3+ 默认 xxl 断点是 @media (min-width: 1400px)，对应 max-width: 1320px；
Bootstrap 4 没有 xxl，只有 xl（≥1200px），想撑到 1400px 宽需额外自定义断点。
别靠 DevTools 里看到的“当前生效值”反推断点——它只表示哪条媒体查询被命中，不是区间边界。
@media 覆盖 xxl 断点（CDN / 已编译 CSS 环境）
这是最常用、最安全的方式，但必须满足三个条件：
• 自定义 CSS 文件必须在 bootstrap.min.css 之后加载
• 媒体查询条件必须严格匹配，比如 @media (min-width: 1400px)，不能写成 1399px 或 1401px
• 不要加 !important——只要选择器是 .container 且顺序对，就能干净覆盖
例如把 1400px+ 屏幕下的容器宽度从默认 1320px 扩到 1440px：
@media (min-width: 1400px) {
.container {
max-width: 1440px;
}
}
如果还想适配 2K/4K 屏（如 ≥1920px），再加一条：
@media (min-width: 1920px) {
.container {
max-width: 1600px;
}
}
重定义 $container-max-widths 变量（Sass 项目）
这是最彻底的方式，但极易静默失效——浏览器不报错，但宽度不变：
• 必须在 @import "bootstrap/scss/functions" 和 @import "bootstrap/scss/variables" 之后、@import "bootstrap/scss/container" 之前重赋值
• 键名必须完整且拼写严格为 xs、sm、md、lg、xl、xxl，缺一个或写成 xxxl 就回退默认值
• 推荐用 map-merge 只改局部，避免漏掉其他断点
$container-max-widths: map-merge($container-max-widths, ( xxl: 1440px ));
如果你新增了自定义断点（比如 xxxl），必须同步更新 $grid-breakpoints 和 $container-max-widths，否则不生效。
最容易被忽略的是：改完 xxl 后，得确认页面实际用的是 .container，而不是 .container-fluid；同时检查是否有其他 CSS 意外重置了 margin: 0 auto，否则即使 max-width 生效，容器也可能左偏或溢出。
