.container 默认在sm及以上断点有左右15px内边距，需用px-0清除而非g-0或p-0；container-fluid本无边距，若有则多因父元素或自定义CSS干扰。
为什么 .container 里总有看不见的左右留白？
Bootstrap 5+ 的 .container 默认带 padding-left 和 padding-right 各 15px（在 sm 及以上断点），这不是 margin，也不是你写的样式干扰，而是框架内置的响应式内边距设计。它保证内容不贴边，但有时你需要全宽布局——比如轮播图、背景色横条、嵌入第三方组件——这时留白就成了干扰。
g-0 不是给 .container 用的，别乱加
g-0 是 Grid 系统的间距控制类，只对 .row 生效，作用是把 row 的 margin-left/margin-right 设为 -0.75rem（即抵消 .col 的 padding），和容器内边距无关。给 .container 加 g-0 完全无效。
- ✅ 正确用法：
- ❌ 错误写法：
（无样式效果） - ⚠️ 注意：
g-0还会同时清掉row内部列之间的 gutter，如果列里有col，需确认是否需要保留间距
清除 .container 内边距，优先用 px-0 而非 p-0
p-0 会清除所有方向的 padding（上、右、下、左），但 .container 通常只需要去掉左右内边距，顶部/底部 padding 往往要保留（尤其配合 .navbar 或 .footer 时）。直接上 p-0 可能导致上下内容塌陷或错位。
- ✅ 推荐：
px-0—— 仅清除padding-left和padding-right - ✅ 备选：
ps-0 pe-0（Bootstrap 5.3+）—— 更语义化，分别控制左（start）、右（end） - ⚠️ 避免：
p-0，除非你明确需要上下也归零 - ? 小技巧：若需在特定断点清除，可用响应式变体，如
px-md-0（仅在md及以上清除左右 padding）
遇到 .container-fluid 还有边距？检查是否被父元素或自定义 CSS 干扰
.container-fluid 本应撑满视口宽度且无默认左右 padding，但如果仍有留白，大概率不是 Bootstrap 的问题：
- ? 检查父元素是否有
padding或margin（常见于自定义 wrapper 或 CMS 生成的外层 div） - ? 查看浏览器开发者工具，确认计算后的
padding-left/padding-right是否真来自.container-fluid（它默认是0） - ? 若确定是全局污染，可加
!important强制覆盖，但更推荐定位源头样式，避免后续维护困难 - ? 补充：Bootstrap 5.3+ 新增
container-xxl等变体，它们和container一样带左右 padding，清除方式相同（px-0）
真正容易被忽略的是响应式断点行为——px-0 在所有断点都生效，而 .container 的 padding 本身是响应式的（xs 下为 0，sm 起才 15px）。如果你只希望在桌面端去边距，就得用 px-md-0 这类条件类，而不是一刀切。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
