多列属性

多列布局类似报纸或杂志中的排版方式，主要用以控制大篇幅文本。

1、column-count : 分隔列数

说明：属性规定元素应该被分隔的列数

用于：除table外的非替换块级元素, table cells, inline-block元素

2、column-gap ： 设置列与列之间的间隔大小；

3、column-rule ： 添加列与列之间的边框

设置或检索对象的列与列之间的边框。复合属性。

column-rule-color规定列之间规则的颜色。

column-rule-style规定列之间规则的样式。

column-rule-width规定列之间规则的宽度。

4、column-fill : 设置列与列之间的高度是否统一

设置或检索对象所有列的高度是否统一

auto：列高度自适应内容

balance：所有列的高度以其中最高的一列统一 （默认值）

5、column-span ： 跨列或者不夸列

设置或检索对象元素是否横跨所有列。

none：不跨列

all：横跨所有列

6、column-width : 设置或检索对象每列的宽度

说明：当column-width 和column-count 同时存在的时候；

column-width ：最小宽度

column-count ：最多列数

7、复合式写法：

columns

column-width 和 column-count

columns：200px 5;

注：

Internet Explorer 10 和 Opera 支持多列属性。

Firefox 需要前缀 -moz-。

Chrome 和 Safari 需要前缀 -webkit-。

8、break-inside CSS 属性描述了在多列布局页面下的内容盒子如何中断,如果多列布局没有内容盒子,这个属性会被忽略。

auto：既不强迫也不禁止在元素内部断行并产生新列

avoid：避免在元素内部断行并产生新列

多列案例（瀑布流）