pug 和 bootstrap 单行中多个 .col 的含义

Question

我正在使用 bootstrap 和 pug/jade 并且我一直在查看一些在一行中使用多个 .col 的示例代码（例如 .col-md-4.col-md-offset-4).我不知道这是做什么的，尤其是单行中的多个 .col（如上）或多行（不同行中的 .col-md-4 和 .col-md-offset-4）之间的区别。任何帮助将不胜感激。

.容器流体。排 .col-md-4.col-md-offset-4

Answer 1

偏移量类 使用 .offset-md-* 类向右移动列。这些类将列的左边距增加 * 列。例如，.offset-md-4 移动 .col-md-4 四列。

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

在这里你可以看到不同之处：

参考Bootstrap documentation了解更多详情。

Answer 2

我想我明白了。我对 .col-md-4.col-offset-md-4 （同一行中有两个 .col）的语法感到困惑，但我想这会转化为 .col-md-4 .offset-md-4.

pug 和 bootstrap 单行中多个 .col 的含义

meaning of multiple .col in single line with pug and bootstrap

bootstrap-4

pug