瀑布流
为内容添加瀑布流布局
用法
为需要添加瀑布流布局的元素添加 data-waterfall 属性
代码
<div data-waterfall>
<div>...</div>
...
</div>参数
可自定义函数参数
| 参数 | 类型 | 默认 | 说明 |
|---|---|---|---|
item |
string | ">*" | 瀑布流布局条目。 |
column |
int | 4 | 分栏数，默认为 4。 |
margin |
int | 16 | 分栏间距，单位为 px。 |
fill |
boolean | false | 是否填充脚部块。 |
footerCls |
string | "placeholder" | 填充的脚部块附加 CSS 样式名称。 |
代码
<div data-waterfall="{column:3, fill: true}">
<div class="placeholder">
...
</div>
...
</div>示例
A
ARDELL/艾黛尔
ANNASUI/安娜苏
ETUDEHOUSE/爱丽小屋
abeeco
AFU/阿芙
Egyptian-Magic-Cream/埃及魔法膏
adidas/阿迪达斯
B
HERBORIST/佰草集
BURBERRY/巴宝莉/博柏利
BIOTHERM/碧欧泉
benefit/贝玲妃
Bavii/柏羽
PaulSmith/保罗史密夫
Bobbi Brown/芭比布朗
BVLGARI/宝格丽
PURE&MILD/泊美
baviphat/芭比菲特
Peter Thomas Roth/彼得罗夫
BeDOOK/比度克
BIODERMA/贝德玛
BKBarry-MBlistex/碧唇
C
Fenix/长生鸟
For Beloved One/宠爱之名
CHARMZONE/婵真
D
Dr.Jart+Dr.MJDior/迪奥
dodo
Dior/迪奥
Dove/多芬
DHC/蝶翠诗
Davidoff/大卫杜夫
E
N-Dorphin/恩朵娉
OPERA/娥佩兰
ELF
eos
F
芳草集
THEFACESHOP/菲诗小铺
Fanxishop/凡茜
FANCL/芳珂（芳凯尔）
VERSACE/范思哲