Question

我正在寻找一个容器，它会像引导容器一样随着页面的宽度而变化，但是当容器和页面的两侧变得很小时，它们之间仍然存在间隙。与现在的做法不同，它要缩小到一定程度然后占据整个页面。

Answer 1

将容器填充设置为0px。

Answer 2

借助媒体查询，Bootstrap根据设备的大小为.container提供不同的宽度：

Extra small devices (<768px): width: auto (or no width)
Small Devices (≥768px): width: 750px
Medium Devices (≥992px): width: 970px
Larger Devices (≥1200px): width: 1170px

Answer 3

您必须在所需的断点处编写媒体查询，并自定义BS4的容器。例如

@media screen and (max-width:425px){
   .container{
     padding-left: 0;
     padding-right: 0
    }
}

Answer 4

在您的媒体查询断点中编写此代码。在启动CSS之后放入CSS。

.container {
  padding-right: 0;
  padding-left: 0;
  margin-right: 0;
  margin-left: 0;
}

<div class="container"></div>

Boostrap容器左右间距

4 个答案: