Bootstrap 4 .card-group不适用于列内的卡片

Question

我想创建一个由3张卡组成的卡组，每组卡应为4列宽。我如何实现这一目标并让.card-group工作以使它们具有相同的高度？

<div class="row">
<div class="card-group">
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="http://lorempixel.com/400/200/">
            <div class="card-block">
                <h4 class="card-title">Card title</h4>
                <p class="card-text">Card text</p>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="http://lorempixel.com/400/200/">
            <div class="card-block">
                <h4 class="card-title">Card title</h4>
                <p class="card-text">Card text</p>
            </div>
        </div>
    </div>
    <div class="col-md-4">
        <div class="card">
            <img class="card-img-top" src="http://lorempixel.com/400/200/">
            <div class="card-block">
                <h4 class="card-title">Card title</h4>
                <p class="card-text">Card text</p>
            </div>
        </div>
    </div>
</div>

Answer 1

删除声明col-md-4类的div。卡片组和卡片组可自动调整卡片宽度，并自动均匀分布。

如果您想查看示例，请从官方文档中查看groups的示例块。