CSS3使用多列制作瀑布流

1. <div class="div1">    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
2. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
3. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
4. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
5. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
6. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
7. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    大家好，这里是用来站位的文字 大家好，这里是用来站位的文字   
8. 大家好，这里是用来站位的文字 大家好，这里是用来站位的文字    </div>   
9.    .div1{   
10. /*分列的数量*/   column-count: 4;   
11. -moz-column-count:4;    /*每一个分列中间的距离*/  
12. -moz-column-gap: 70px;    column-gap: 70px;   
13. /*每两个列之间的线和线的颜色*/   column-rule: 5px outset #FF0000;   
14. -moz-column-rule: 5px outset #FF0000;    }   
15.   

效果图：

CSS3使用多列制作瀑布流：