前端之家收集整理的这篇文章主要介绍了
html – 如何强制所有元素在页面中具有相同的高度?,
前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
以下图片是我的产品展示.我使用Bootstrap 3.2,整个页面都在< div class =“col-xs-12”>元素,您可以在图像的底部看到动态生成的HTML代码.
我的问题是产品 – 容器div没有相同的高度(查看突出显示的照片).
是否可以将所有高度固定为不影响响应性的高度?
最佳答案
几行jQuery可以
解决这个问题:
var maxHeight = 0;
$(".Box").each(function () {
if ($(this).height() > maxHeight) {
maxHeight = $(this).height();
}
});
$(".Box").height(maxHeight);
(将.Box替换为您要均衡的div类.)
快速播放jsfiddle以显示其工作原理.