瀑布流

瀑布流布局原理

1.瀑布流中的元素宽度相等,高度不一致
2.先确定好排几列,可以固定宽度,也可以用JS动态计算列数
列数 = 容器宽度/元素宽度
3.定义与列数相同个数的数组,用来记录每列的高度
4.元素应该放置在高度最小的那一列
5.放置完元素后要更新高度数组

demo1
https://leeeozhang.github.io/Demos/ex_waterfall/
demo2
https://leeeozhang.github.io/Demos/news_waterfall/

你可能感兴趣的:(瀑布流)