集裝箱

.container 在 bootstrap 中為每個螢幕大小設定一個固定寬度(xs, sm, md, lg);

.container-fluid 擴充套件以填充可用寬度。

@media (min-width: 568px) {
  .container {
    width: 550px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

根據正在檢視網頁的視口的寬度，容器類為其 div 提供特定的固定寬度。

另一方面，你的 .container-fluid 元素將不斷調整大小，因為你對瀏覽器寬度進行了最小的更改。