厚脸皮的jquery解决方案，如果有人感兴趣。只要确保你所有的col (el)有一个共同的类名…如果你将它绑定到$(window).resize，也可以响应

function equal_cols(el)
{
    var h = 0;
    $(el).each(function(){
        $(this).css({'height':'auto'});
        if($(this).outerHeight() > h)
        {
            h = $(this).outerHeight();
        }
    });
    $(el).each(function(){
        $(this).css({'height':h});
    });
}

使用

$(document).ready(function(){
   equal_cols('.selector');
});

注意:这篇文章已经根据@Chris的评论进行了编辑，该代码只在$.each()函数中设置了最后一个最高高度

只是通过检查引导文档，我发现了列相同高度问题的简单解决方案。

仅为所需的视口添加额外的clearfix

<div class="clearfix visible-xs-block"></div>

例如:

<div class="col-md-3 col-xs-6">This is a long text</div>
<div class="col-md-3 col-xs-6">This is short</div>
<div class="clearfix visible-xs-block">This is a long text</div>
<div class="col-md-3 col-xs-6">Short</div>
<div class="col-md-3 col-xs-6">Long Text</div>
<div class="clearfix visible-xs-block"></div>
<div class="col-md-3 col-xs-6">Longer text which will push down</div>
<div class="col-md-3 col-xs-6">Short</div>

请参考http://getbootstrap.com/css/#grid-responsive-resets

如果这在您的上下文中有意义，您可以在每次休息后添加一个空的12列div，它作为包含行中最高单元格底部的分隔符。

< div class = "行" > <div class="col-xs-6">一些内容</div> < div class = " col-xs-6”> 很多内容!很多内容!很多内容!很多内容!很多内容! < / div > <div id="space -div" class="col-x -12"></div> . <div class="col-xs-6">更多内容 < / div > < !——这个你忘了关——>

希望这能有所帮助!

我知道我来晚了，但是现在您可以使用“min-height”样式属性来达到您的目的。

厚脸皮的jquery解决方案，如果有人感兴趣。只要确保你所有的col (el)有一个共同的类名…如果你将它绑定到$(window).resize，也可以响应

function equal_cols(el)
{
    var h = 0;
    $(el).each(function(){
        $(this).css({'height':'auto'});
        if($(this).outerHeight() > h)
        {
            h = $(this).outerHeight();
        }
    });
    $(el).each(function(){
        $(this).css({'height':h});
    });
}

使用

$(document).ready(function(){
   equal_cols('.selector');
});

注意:这篇文章已经根据@Chris的评论进行了编辑，该代码只在$.each()函数中设置了最后一个最高高度

我寻找了一个解决同样问题的方法，发现一个方法很有效!!- 几乎没有额外的代码..

参见https://medium.com/wdstack/bootstrap-equal-height-columns-d07bc934eb27 为了更好的讨论，你想要的答案在底部，有一个链接。

https://www.codeply.com/go/EskIjvun4B

对我来说，这是正确的回应方式。 引用: .．. 3 -使用flexbox(最好!)

截至2017年，在响应式设计中制作等高列的最佳(也是最简单)方法是使用CSS3 flexbox。

.row.display-flex {
  display: flex;
  flex-wrap: wrap;
}
.row.display-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

简单地使用:

div class="container">
   <div class="row display-flex .... etc..