CSS3 Columns—分列式布局

关注本头条号，专注做前端。

CSS3里的column系列属性提供了各种不同的功能，通过组合使用它们，你能得到相应的任何分栏式布局。有了这些属性，我们不需要再使用 float,clear,margin 等属性进行调控。

column-count: 列数目

column-gap: 各列之间间隙宽度

column-width: 建议宽度；未必会使用，浏览器基于此数值进行计算

column-rule-width：列之间分割线宽度

column-rule-style：列之间分割线风格

column-rule-color：列之间分割线颜色

column-span: 允许一个元素的宽度跨越多列

column-fill: 分列方式

浏览器支持：

Internet Explorer 10 和 Opera 支持 column 属性。

Firefox 支持替代的 -moz-column 属性。

Safari 和 Chrome 支持替代的 -webkit-column 属性。

注释：Internet Explorer 9 以及更早版本的浏览器不支持 column 属性。