如何在 Bootstrap 4 Beta 中实现自定义列偏移？

Bootstrap 列偏移不起作用：解决方案

在 Bootstrap 4 Beta 中，列偏移似乎已成为开发人员关注的一个问题。根据文档，之前使用的 offset-md-* 类已被删除。不过，这个问题在 Beta 2 中已暂时解决，恢复了熟悉的偏移类。

但是，在 Beta 1 中，使用 .ml-auto 类。虽然此方法确实可以替换 col-md-4 列，但它实现了四列的偏移。这并不是大多数开发人员所寻求的；他们想要像以前的

那样的自定义偏移量。使用

作为替代品被证明是无效的。因此，这是一个错误，还是有可行的解决方法？幸运的是，该问题已通过恢复偏移类得到纠正。尽管如此，Beta 1 中引入的新自动边距仍然可以用于列偏移。这些边距会将列尽可能向右移动。因此，偏移量取决于可用空间。如果

col-md-4右侧没有其他列，它将占据该行的整个右侧。

替代解决方案

或者，您可以实现虚拟列来实现两列offset:

<div class="row">
  <div class="col-md-2"></div>
  <div class="col-md-4">
    ...
  </div>
</div>

要居中两个

col-md-4 列，ml-auto 和 mr-auto 的组合可以使用：

<div class="row">
  <div class="col-md-4 ml-auto">
    .
  </div>
  <div class="col-md-4 mr-auto">
    .
  </div>
</div>

最后，将单个

col-md-4 列，只需使用 mx-auto 即可实现两边等边距：

<div class="row">
  <div class="col-md-4 mx-auto">
    .
  </div>
</div>

注意： 具体列偏移类将在 Beta 2 中重新引入。

以上是如何在 Bootstrap 4 Beta 中实现自定义列偏移？的详细内容。更多信息请关注PHP中文网其他相关文章！