应选.container：当需内容居中、两侧留白，且在不同屏幕下自动切换固定最大宽度（如≥1200px为1170px，≥992px为970px，≥768px为750px）时。
什么时候该用 .container 而不是 .container-fluid
当你需要内容居中、两侧留白，且在不同屏幕尺寸下自动切换「固定最大宽度」时，选 .container。它不是写死的 width 值，而是靠媒体查询动态设定：≥1200px 时为 1170px，≥992px 时为 970px，≥768px 时为 750px， 时退化为 <code>100%（此时和 .container-fluid 表现一致，仅多出左右 15px padding）。典型场景：正文区域、表单页、卡片列表。
.container-fluid 真的是“响应式”吗
不是。它没有媒体查询，只有 width: 100%、margin: 0 和固定 padding: 0 15px（Bootstrap 4+ 统一为 15px；旧版如 Bootstrap 3 某些版本 padding 为 0，需实测）。所谓“全宽”，是始终填满 viewport，不随断点缩放——它的响应性只体现在内部子元素（比如 .row）对栅格系统的适配上。典型场景：导航栏、顶部轮播图、底部通栏广告。
嵌套 .container 和 .container-fluid 会怎样
布局必然错位，Bootstrap 明确禁止这种写法。常见错误现象包括：padding 叠加导致内容被挤出视口、左右留白异常放大、.row 的负 margin 失效。原因在于两者都自带 padding-left/right: 15px，嵌套后变成 30px，而 .row 的 margin-left/right: -15px 只能抵消一层。不要试图用 .container-fluid 包 .container 来“撑开”内容，也不要用 .container 包 .container-fluid 来“居中”全宽区块——它们定位逻辑冲突，必须平级使用。
想自定义宽度，能不能直接改 .container 的 max-width
可以但不推荐。因为 .container 的断点逻辑硬编码在框架 CSS 中（例如 @media (min-width: 1200px)），单独覆盖 max-width 会导致断点失效或行为不一致。更稳妥的方式是：复制 .container-fluid 规则，手动添加你想要的媒体查询和 max-width，并控制 padding。比如要一个在桌面端固定 1300px、其余同 .container-fluid 的容器，就该新建类，而不是魔改 .container。
