电话咨询 155-6481-2378

解决您的问题和     虑!

博客首页 > 其他内容

bootstrap高度不统一产生布局错乱的解决方法

2020-5-22

bootstrap高度不统一产生布局错乱的解决方法,例如产品是一行4个,因为高度不统一,导致有的第二行只显示了1个

解决办法就是没4个加一次 row标签

例如 

<div class="row">

一行4个产品

</div>

那第二行就不会因为第一行高度不统一导致的错位问题了.


第二种方法 ,获取图片最大高度,然后所有图片都按照这个高度,这样图片大小就统一了,是首选方法

    <script>

window.onload = function(){

   var arr = new Array();

    $('.product_img img').each(function(i){

       arr[i] = $(this).outerHeight();

    });


   //if($(window).width() >= 1024){  //只有大于1024px才需要

       $('.product_img img').height(Math.max.apply(null,arr));

    //}

}

</script>


  • 付费企业邮箱,安全,海外收发稳定,到达率高,退信率低,无限容量 [详情]
    买2年送2年
  • 免费提供海关数据,可通过货物名称,供应商,进口商,标签查询 [介绍]
    完全免费
  • 日发一万封开发信,不怕邮箱被封,做外贸发开发客户必备 (建站客户免费)
    完全免费
  • 谷歌关键词排名,搜索引擎营销,优化产品排名,让多产品关键词排名谷歌首页!
    即将上线