CSS3 多列属性
本章节我们将学习以下几个 CSS3 的多列属性:
column-count 分割的列数column-gap 列与列的间隙column-rule-style 列与列间的边框样式column-rule-width 列与列间的边框厚度column-rule-color 列与列间的边框颜色column-rule 上面3个的缩写column-span 指定元素跨越多少列column-width 指定列的宽度
CSS3 创建多列
代码：
<style>
div
{
border:1px solid #000;
500px;
padding:5px;
column-count:3;
column-gap:20px;
column-rule:dotted 1px red;
}
</style>
效果：
当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。
指定元素跨越多少列
代码：
<div style="column-count:3;">
<h2 style="column-span:all">这是标题</h2>
当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。
</div>
效果：
这是标题
当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。column-span的默认值是1，不设置的效果为：