Question

我正在使用Bootstrap 4创建登录页面。使用Bootstrap的容器的最大宽度似乎是1140px？我的显示器现在是1920px。我是否必须将bootstrap的值覆盖为1920px才能使其支持该大小的监视器？

这是我正在使用的代码，我希望将登录表单的内容集中在一起（代码仅用于测试以便将内容集中在一起）：

<body>
<div class="container h-100 d-flex justify-content-center">
    <div class="jumbotron my-auto">
      <h1 class="display-3">Hello, world!</h1>
    </div>
</div>
</body>

或者对于更大的显示器，我应该将尺寸增加到非常高的值（如999999px）以支持它们吗？

感谢您的反馈！

Answer 1

只需使用container-fluid类而不是container来获得全宽。

在你的情况下，更好的选择是使用像这样的流体jumbotron：

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

<div class="jumbotron jumbotron-fluid">
  <div class="container">
    <h1 class="display-4">Fluid jumbotron</h1>
    <p class="lead">This is a modified jumbotron that occupies the entire horizontal space of its parent.</p>
  </div>
</div>

上面有container级的流畅的jumbotron是一个不错的选择，因为它可以确保宽屏4K屏幕上的用户不会生你的气。： - ）

更改Bootstrap容器的最大宽度

1 个答案: