column 实现瀑布流
作者：互联网
1 <!DOCTYPE html>
2 <html lang="zh">
3 <head>
4 <meta charset="UTF-8">
5 <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
6 <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 <title></title>
8 <style type="text/css">
9 * {margin: 0;padding: 0;}
10 .pool {column-count: 2;width: 100%;column-width: auto;font-size: 0;column-gap: 6px;}
11 .pool > div {background-color: pink;width: 100%;border: 1px solid red;box-sizing: border-box;
12 display: inline-block;margin-bottom: 6px;}
13 .h1 {height: 100px;}
14 .h2 {height: 80px;}
15 .h3 {height: 50px;}
16 </style>
17 </head>
18 <body>
19 <div id="app">
20 <div class="pool">
21 <div class="h1"></div>
22 <div class="h2"></div>
23 <div class="h3"></div>
24 <div class="h2"></div>
25 <div class="h1"></div>
26 </div>
27 </div>
28 </body>
29 </html>
标签：box,width,column,6px,height,实现,瀑布,border 来源： https://www.cnblogs.com/qiuxd/p/13035277.html