columns属性——多列布局

columns[ˈkɑ:ləm]                    多列布局
与之相关的属性或子属性如下所示

一、columns             集成column-width和column-count两个属性

二、column-width        定义每列列宽度
属性值如下所示：
1、auto             默认值，自适应

2、长度值           设置列宽。此处的列宽在功能上相当于最小宽度

三、column-count        定义分列列数
属性值如下所示
1、auto             默认值，自适应。根据窗口宽度和column-width的设置，决定显示几列。
2、数值             设置列数。此处的列数相当于最大列数，具体显示要看column-width是使用

自适应，还是使用长度值。

四、column-gap          定义列间距

五、column-rule         定义每列中间的分割线
列边线不会影响到布局（功能上类似于轮廓outline），它会根据布局的缩放自我调整是否显示。

以上5个属性是经常使用的多列布局属性

六、column-span         定义多列布局中子元素跨列效果，Firefox不支持,只有 Chrome 和 Opera 支持 column-span 属性。
此功能类似于表格元素<table>中列元素<td>的colspan属性，你可以用来设置文章标题（横跨
所有列）
属性值如下所示
1、none           默认值，表示不跨列

2、all            表示跨所有列

注意：column-span属性必须用在块级元素中，若在行内元素中使用，则没有任何效果

七、column-fill         控制每列的列高效果，主流浏览器不支持

注意：多列布局属性css3标准格式支持度较低，请在标准格式之前加上带前缀的样式