如何使用 Bootstrap 4 和 Scss 将容器的宽度覆盖为 1440px 并使列同时响应

Posted 2023-03-06

【中文标题】如何使用 Bootstrap 4 和 Scss 将容器的宽度覆盖为 1440px 并使列同时响应

【英文标题】：How can I override the width of container to 1440px and make the columns in the same time Responsive using Bootstrap 4 and Scss

【发布时间】：2021-04-02 20:08:43

【问题描述】：

如何将容器的宽度覆盖为 1440 像素并使列同时响应。我正在使用 Bootstrap 4 和 SCSS。

<div class="container">
    <!-- Container 1440px-->
    <div class="row">
        <div class="first"></div><!-- Section 825px-->
        <div class="second"></div><!-- Section 615px-->
    </div>
</div>

【问题讨论】：

应用你自己的css

尝试写css比如：.containerwidth:1440px; .firstwidth:825px; .secondwidth:615px;

【参考方案1】：

媒体查询只会在大于 1200 像素（或您想要的任何宽度）的屏幕上将容器的宽度调整为 1440 像素。它也将保持您网站的响应能力！

@media (min-width: 1200px) 
  .container 
    width: 1440px;