Question

在Bootstrap 4 Alpha中，we had offsets。现在Bootstrap 4已正式发布，we have a bad alternative。

以前，您可以实现以下目标：

<div class="col-2"></div>
<div class="col-2">This is offset by 2</div>
<div class="col-2"></div>
<div class="col-2">This is offset by 2</div>
<div class="col-2"></div>
<div class="col-2">This is offset by 2</div>

只需做：

<div class="col-2 offset-2">This is offset by 2</div>
<div class="col-2 offset-2">This is offset by 2</div>
<div class="col-2 offset-2">This is offset by 2</div>

全部通过将offset-2类添加到元素中。你不能再这样做了，如果你正在寻找一种方法来做我说的第一件事，你需要按照这个顺序去做。

真的是，最新的Bootstrap 4版本对此有何不满？有没有替代方案，这不需要破解源文件？

Answer 1

Bootstrap 4中的新网格系统仍支持offsetting columns类offset-*。

请参阅下面的代码：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>

<div class="container">
  <div class="row">
    <div class="col-2 offset-2">Offset by 2</div>
    <div class="col-2 offset-2">Offset by 2</div>
    <div class="col-2 offset-2">Offset by 2</div>
  </div>
</div>

新的Bootstrap 4偏移解决方案？

1 个答案: