Bootstrap4 水平对齐

在Bootstrap4栅格系统中可以使用水平对齐。

• 左对齐justify-content-start
• 居中对齐justify-content-center
• 右对齐justify-content-end
• 环绕对齐justify-content-around
• 两端对齐justify-content-between

示例：

<div class="container">
  <p>水平对齐</p>
  <p>水平对齐 - 左对齐 - justify-content-start</p>
  <div class="row justify-content-start">
    <div class="col-4">One of two columns</div>
    <div class="col-4">One of two columns</div>
  </div>
  <p>水平对齐 - 居中对齐 - justify-content-center</p>
  <div class="row justify-content-center">
    <div class="col-4">One of two columns</div>
    <div class="col-4">One of two columns</div>
  </div>
  <p>水平对齐 - 右对齐 - justify-content-end</p>
  <div class="row justify-content-end">
    <div class="col-4">One of two columns</div>
    <div class="col-4">One of two columns</div>
  </div>
  <p>水平对齐 - 环绕对齐 - justify-content-around</p>
  <div class="row justify-content-around">
    <div class="col-4">One of two columns</div>
    <div class="col-4">One of two columns</div>
  </div>
  <p>水平对齐 - 两端对齐 - justify-content-between</p>
  <div class="row justify-content-between">
    <div class="col-4">One of two columns</div>
    <div class="col-4">One of two columns</div>
  </div>
</div>