贝利信息

如何移除 Bootstrap 的默认内边距(padding)

日期:2026-01-11 00:00 / 作者:心靈之曲

bootstrap 的 `container` 类会自动添加左右内边距(padding),导致页面内容两侧出现白边;只需移除该类或改用 `container-fluid` 即可消除默认 padding。

在使用 Bootstrap 构建响应式页面时,开发者常将内容包裹在

中以实现居中与最大宽度控制。然而,container 类默认设置了 padding-left: 15px 和 padding-right: 15px(在所有断点下),这正是你在动画页头(如 #large-header)两侧看到“白边”的根本原因——并非 margin 或定位问题,而是容器自身的 padding。

✅ 正确解决方式如下:

⚠️ 注意事项:

总结:Bootstrap 的 padding 行为是设计使然,而非 bug。理解 container 与 container-fluid 的语义差异,并按需选用,是构建专业、可控布局的关键一步。