Bootstrap的.container默认带15px左右内边距，是为防止内容紧贴视口边缘并配合.row负外边距实现栅格对齐的设计；若需全宽布局，应在Bootstrap CSS后全局重置.container的padding-left和padding-right为0。
为什么 Bootstrap 的 .container 总是带 15px 左右内边距？
因为 bootstrap 4/5 默认给 .container 设了 padding-left: 15px 和 padding-right: 15px，目的是让内容不紧贴视口边缘，同时配合 .row 的负外边距实现栅格对齐。这不是 bug，是设计前提——但如果你要做全宽 banner、背景色溢出或自定义布局，这 15px 就成了干扰。
直接覆盖 .container 的 padding 最简单
在你自己的 CSS 文件（或 <style></style> 块）里加这条规则即可，它会盖过 Bootstrap 的默认样式：
.container {
padding-left: 0;
padding-right: 0;
}
注意几点：
- 这条规则必须在 Bootstrap CSS 之后加载，否则无效
- 如果用了 Sass/SCSS，更推荐在变量层覆盖：
$container-padding-x: 0 !default;，然后重编译 - 别用
!important—— 它可能破坏响应式断点下的 padding 逻辑（比如.container-sm在小屏下本该有 padding）
用 .container-fluid 替代？不一定合适
.container-fluid 确实默认无左右 padding，但它宽度是 100%，不带 max-width 限制。这意味着：
- 在大屏（如 2560px）下，内容会无限撑开，失去阅读舒适宽度
- 如果你只需要“去掉 padding”，但还想保留居中 + 最大宽度（比如 1200px），
.container-fluid就不是等价替代 - 折中方案：给
.container-fluid手动加max-width和margin: 0 auto，但不如直接改.container干净
响应式场景下要小心断点差异
Bootstrap 5 的 .container 在不同断点下 padding 是统一的（始终 15px），但如果你用的是自定义断点或第三方主题，某些变体（如 .container-lg）可能被额外设置了 padding。验证方法很简单：
打开浏览器开发者工具，选中容器元素，看 Computed 面板里的 padding-left 和 padding-right 实际值。常见陷阱：
- 媒体查询里写了
@media (min-width: 992px) { .container { padding: 0; } }，结果小屏仍有 15px，大屏却没了——忘了小屏也需要清零 - 用了
.px-0工具类，但它只作用于当前元素，而.container内部的.row还依赖它的 padding 来抵消自身margin，可能导致子元素错位
最稳的做法，还是全局重置 .container 的左右 padding，并确保它在所有断点下生效。
