Question

包裹在.card-columns时是否可以从左到右订购 Bootstrap 4卡？

从上到下（默认）：

1 3 5
2 4 6

从左到右：

1 2 3
4 5 6

由于高度不同，我需要使用类似砌体的网格。

Answer 1

CSS列的顺序是从上到下，然后从左到右，所以渲染列的顺序将为..

1  3  5
2  4  6

无法更改CSS列的顺序。建议您使用像砌体这样的其他解决方案。 https://github.com/twbs/bootstrap/issues/17882

此外，启用flexbox won't help因为Bootstrap card-deck使用CSS列（而不是flexbox）进行砌体效果。但是，您可以将card-deck和flexbox用于相同高度的卡片：http://www.codeply.com/go/YFFFWHVoRB

另一种选择是使用grid along with flexbox代替card-deck：

您可以将新的d-flex课程用于eliminate the extra CSS：

<div class="col-sm-4 d-flex pb-3">
    <div class="card card-block">
        Card. I'm just a simple card-block.
    </div>
</div>