CSS3 多列再需要设计多个布局时是非常有用的。比如，报纸布局。
主要属性如下：
* column-count ： 指定元素的列数
* column-rule ： 指定的列之间的差距
* column-gap ： 设置列之间的宽度，样式和颜色
例子：
~~~
.newspaper {
column-count: 3;
-moz-column-count: 3; /* Firefox */
-webkit-column-count: 3; /* Safari and Chrome */
column-gap: 40px;
-moz-column-gap: 40px; /* Firefox */
-webkit-column-gap: 40px; /* Safari and Chrome */
column-rule: 4px outset #ff00ff;
-moz-column-rule: 4px outset #ff00ff; /* Firefox */
-webkit-column-rule: 4px outset #ff00ff; /* Safari and Chrome */
}
~~~
## 属性
| 属性 | 说明 | CSS |
|-----|------|--------|
| [column-count](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定元素应分为的列数 | 3 |
| [column-fill](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定如何填充列 | 3 |
| [column-gap](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定列之间差距 | 3 |
| [column-rule](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 一个用于设置所有列规则的简写属性 | 3 |
| [column-rule-color](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定的列之间颜色规则 | 3 |
| [column-rule-style](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定的列之间的样式规则 | 3 |
| [column-rule-width](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定的列之间的宽度规则 | 3 |
| [column-span](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定一个元素应该横跨多少列 | 3 |
| [column-width](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 指定列的宽度 | 3 |
| [columns](http://waylau.gitbooks.io/css3-tutorial/content/docs/Multiple%20Columns.html#) | 缩写属性设置列宽和列数 | 3 |
## 源码
本文中所用例子源码参见 [https://github.com/waylau/css3-tutorial](https://github.com/waylau/css3-tutorial) 中 `samples` 目录下的 multiple_columns.html
