flex布局使用justify-content: space-between;,由于数量不足,导致间距空白,

 

flex 自适应排版中由于数量不够造成的空白

 

 

建议用js填充元素

// flex空白元素填充
function flex_empty(listbox,ele,num,emptyclass){
	var len=listbox.find(ele).length;
	var need=Math.ceil(len/num)*num-len;
	for(var i=0;i<need;i++){
		var create_ele=document.createElement(ele);
		create_ele.className=emptyclass;
		listbox.append(create_ele);
	}
}

  

使用!

flex_empty($('.activity_online_list'),'li',3,'empty');

参数说明:1:直接的外包裹框,一般为ul,2:对应的要排版的元素,3:正常情况修下每行排版的元素个数,4:补充元素的类别

 

flex 自适应排版中由于数量不够造成的空白

 

flex 自适应排版中由于数量不够造成的空白

 

相关文章:

  • 2021-12-10
  • 2021-09-30
  • 2021-12-24
  • 2022-01-01
  • 2022-12-23
  • 2021-08-02
  • 2021-12-11
  • 2022-12-23
猜你喜欢
  • 2021-12-24
  • 2022-02-21
  • 2022-12-23
  • 2021-05-07
  • 2022-12-23
  • 2021-07-06
  • 2022-12-23
相关资源
相似解决方案