如何将Bootstrap Jumbotron居中

Question

我正在使用bootstrap的超大屏幕，并且具有以下功能：

    <div class="container">
      <div class="row">
        <div class="jumbotron">
          <h1 class="display-4">Hello, world!</h1>
          <p class="lead">This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.</p>
          <hr class="my-4">
          <p>It uses utility classes for typography and spacing to space content out within the larger container.</p>
          <p class="lead">
            <a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a>
          </p>
        </div>
      </div>
    </div>

现在此代码获取以下信息：

我现在想将超大屏幕居中放置在屏幕中央，我知道我可以将mt类添加到超大屏幕，但这并不能使我位于准确的中央位置

Answer 1

html,body { height: 100% }
body { display: flex; align-items: center; justity-content: center }

Answer 2

Bootstrap 4的ajax类在左侧和右侧创建了-15px的边距。这就是为什么它有点差的原因。请执行以下操作：

row