引导容器最大宽度

Question

是否可以使用默认设置来设置引导容器的max-width？ （无需修改代码）

我试图将容器的最大宽度设置为540px，但是css规则被覆盖为1140px；

代码：

<div class="container-sm">
  <div class="border border-primary">
    <p>This content should have max-width of 540px</p>
  </div>
</div>

结果：

https://codepen.io/catalingavan/pen/NWGapKa

Answer 1

bootstrap容器（container-sm，container-md，container-lg，container-xs）会根据使用的设备类型和类更改其宽度。

因此，在您的情况下-由于您使用的是container-sm，因此我只是创建了一个覆盖

.container-sm {
    max-width: 540px;
}

修改了密码笔-https://codepen.io/AbhijatSaxena/pen/GRpMWZr

（我还建议您设置其他类型容器的最大宽度，以确保一致性）

引导站点的参考