应使用.container-fluid配合响应式内边距类（如px-sm-3 px-xl-0），因其无max-width限制、天然撑满视口，再通过断点控制padding实现小屏留白、大屏贴边。
直接用 .container-fluid，别碰 .container
想让容器真正铺满视口宽度（100vw），.container 从设计上就做不到——它带 max-width 媒体查询（比如 xl 下是 1140px）和 margin: 0 auto，本质是“居中限宽”，不是“全屏”。硬加 w-100 或 mx-0 只会让它卡在那个 max-width 值里，左右还是留白。
正确起点只有一个：.container-fluid。它默认就是 width: 100%（实际计算为 100vw），无 max-width，无自动居中，天然贴边。
- 适用场景：顶部导航、全宽轮播、背景色区块、登录页外层容器
- 注意：它只管宽度，高度仍为空，必须额外控制（比如加
min-vh-100） - 常见错误：把
.container-fluid套在已有.container里面——父级的max-width和padding会立刻把它截断
.container-fluid 为什么看起来没贴边？查父级和内边距
写了 .container-fluid 却仍有左右空白，90% 是被父元素悄悄限制了。Bootstrap v5 默认给 .container-fluid 设了 padding-left: 1.5rem 和 padding-right: 1.5rem（即 px-3），这不是 bug，是设计默认值。
清除它必须用 px-0（不是 p-0，那会清上下；也不是 mx-0，那是 margin）。
- 快速验证：DevTools 里选中元素 → Computed → 看
width是不是100vw，padding-left/padding-right是不是0px - 常见干扰源：
<body>被 CMS 或自定义 CSS 加了max-width或padding；外层 wrapper div 带了px-3或mx-auto - 安全写法：
<div class="container-fluid px-0">——px-0作用于所有断点，包括xs
小屏留白、大屏铺满？用响应式 px-* 类组合
如果目标是“小屏有左右留白、大屏真正贴边”，不能靠改 .container 的 margin（会破坏居中逻辑），而要用 .container-fluid + 断点内边距控制。
关键点：px-sm-3 在 xs（px-2 才覆盖 xs；高断点类会覆盖低断点类，但 xs 没对应类就按默认走。
- 覆盖全部小屏（
xs–md）+ 大屏清零：px-2 px-sm-3 px-md-4 px-xl-0 - 更简洁常用写法：
px-sm-3 px-xl-0（xs无 padding，若需xs也留白，必须补px-2） - 别用外层 wrapper 套
.container模拟：“<div class="mx-sm-3 mx-xl-0"><div class="container">” 会导致.container自身宽度被max-width截断，右侧永远留白
高度也要“全屏”？min-vh-100 别直接加在 .container 上
只设宽度为 100vw，高度塌缩成一条线，根本看不出“全屏”。但直接给 .container 加 min-vh-100 或 h-100 很可能无效——因为 .container 不继承父高，且其父级（比如 <main> 或 <section>）往往没设高度行为。
正确做法是把 min-vh-100 加在 .container-fluid 的父级或同级区块上，例如背景容器：
<section class="min-vh-100 bg-dark">
<div class="container-fluid px-0">
<div class="container">内容居中</div>
</div>
</section>
- 有固定 header/footer 时，必须用 flex：
<body class="d-flex flex-column min-vh-100">，再把.container-fluid放进<main class="flex-grow-1"> - 避免用
vh-100：iOS Safari 地址栏收放时高度抖动，且内容超长会被截断 - 如果容器内用了
.row，记得加h-100到.row或其子.col，否则 flex 高度不传递
真正难的不是加哪个类，而是意识到：全屏宽度和全屏高度是两个独立问题，各自有干扰链；.container 和 .container-fluid 是语义不同的容器，混用必出视觉错位；而所有“看起来没生效”的情况，几乎都卡在某一层看不见的 padding、max-width 或高度继承断点上。
