您可以使用下面的代码

var heights = $(".row > div").map(function() {
    return $(this).height();
}).get(),
maxHeight = Math.max.apply(null, heights);
$(".row > div").height(maxHeight);

对于那些寻找一个快速，简单的解决方案-如果你有一个相对一致的块内容集，在div上设置一个最小高度，比最大的块大一点，可以更容易实现。

.align-box {
    min-height: 400px;
}

如果任何人使用bootstrap 4并寻找等高列，只需使用row-等高来父div

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css" rel="stylesheet" /> <div class="row row-eq-height"> <div class="col-xs-4" style="border: 1px solid grey;">.row.row-eq-height &gt; .col-xs-4</div> <div class="col-xs-4" style="border: 1px solid grey;">.row.row-eq-height &gt; .col-xs-4<br>this is<br>a much<br>taller<br>column<br>than the others</div> <div class="col-xs-4" style="border: 1px solid grey;">.row.row-eq-height &gt; .col-xs-4</div> </div>

裁判:http://getbootstrap.com.vn/examples/equal-height-columns/

@media (min-width: @screen-sm-min) {
    div.equal-height-sm {
        display: table;


        > div[class^='col-'] {
            display: table-cell;
            float: none;
            vertical-align: top;
        }
    }
}

<div class="equal-height-sm">
    <div class="col-xs-12 col-sm-7">Test<br/>Test<br/>Test</div>
    <div class="col-xs-12 col-sm-5">Test</div>
</div>

例子:

https://jsfiddle.net/b9chris/njcnex83/embedded/result/

这里改编自几个答案。一旦IE8和ie9被淘汰，一旦Android 2被淘汰，基于flexbox的答案就是正确的方法。X已经死了，但在2015年并不是这样，在2016年也不会。IE8和ie9的使用率仍占4-6%，这取决于你如何衡量，对于许多企业用户来说，情况要糟糕得多。http://caniuse.com/#feat=flexbox

display: table, display: table-cell的技巧是向后兼容的，一个很棒的事情是唯一严重的兼容性问题是Safari的问题，它强制box-sizing: border-box，这已经应用到Bootstrap标签上了。http://caniuse.com/#feat=css-table

显然，您可以添加更多做类似事情的类，如.equal-height-md。我将这些标记与div绑定在一起，以便在受限制的使用中获得较小的性能收益，但您可以删除标记，使其像Bootstrap的其余部分一样更通用。

注意，这里的jsfiddle使用CSS，因此，Less将提供的内容硬编码在链接的示例中。例如@screen-sm-min已经被Less插入的- 768px所取代。

你也可以使用内联伸缩，这工作得很好，可能比用CSS修改每个行元素要干净一点。

对于我的项目，我希望每行谁的子元素有边界是相同的高度，这样边界将看起来参差不齐。为此，我创建了一个简单的css类。

.row.borders{
    display: inline-flex;
    width: 100%;
}

您可以使用下面的代码

var heights = $(".row > div").map(function() {
    return $(this).height();
}).get(),
maxHeight = Math.max.apply(null, heights);
$(".row > div").height(maxHeight);