實(shí)現(xiàn)瀑布流布局有兩種方式：
1. 使用javascript 實(shí)現(xiàn)。
2. 使用css3 的column屬性實(shí)現(xiàn)。
javascript是通過頁面的寬度以及元素塊的寬度計(jì)算出列數(shù)懈费，然后計(jì)算出每一個塊的left與top距離來確定元素塊的位置。當(dāng)然需要先設(shè)置包括所有元素塊的父元素的position為relative 以及 每個元素塊的position設(shè)置為absolute缔杉。
主要實(shí)現(xiàn)代碼：
css3 是通過設(shè)置包裹所有元素塊的盒子的column屬性來實(shí)現(xiàn)瀑布流扑馁。示例代碼如下：
或者
兩種方式對比：
css3 ：
javascript：
