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

我想创建一个包含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>

最佳答案

删除声明col-md-4类的div。卡片组和卡片组可自动调整卡片宽度，并自动将它们均匀地隔开。

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

关于html - Bootstrap 4 .card-group不适用于列内的卡，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35022945/