Bootstrap 中的偏移列

Question

这是我想做的事情的想法：

 <div class="container-fluid">
    <div class="row">
        <div class="col-sm-2"></div>
        <div class="col-sm-4"></div>
        <div class="col-sm-4"></div>
        <div class="col-sm-2"></div>
    </div>
</div>

使用偏移量将如何工作？

原文由 sumguy 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

偏移量就像一个空白列，将保留在您的列之前。例如，如果您想要一个占屏幕一半大小并且正好位于中间的列，您必须执行以下操作：

 <div class="col-sm-6 col-sm-offset-3"></div>

一整行有 12 列。这样，您将有 6 列（行的一半）和 3 列的偏移量。它将正好在屏幕的中间。

查看 Bootstrap 文档。

原文由 Luiz Henrique 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

在 Bootstrap 3 中， 像这样……

 <div class="container-fluid">
    <div class="row">
        <div class="col-sm-4 col-sm-offset-2"></div>
        <div class="col-sm-4"></div>
    </div>
</div>

http://www.codeply.com/go/7wofwfzrH3

在 Bootstrap 4 中，像这样……

 <div class="container-fluid">
    <div class="row">
        <div class="col-sm-4 offset-sm-2"></div>
        <div class="col-sm-4"></div>
    </div>
</div>

https://www.codeply.com/go/t5DTGwero8

原文由 Zim 发布，翻译遵循 CC BY-SA 4.0 许可协议