css3 column CSS3 column-gap 属性

css3 column

CSS3 column 是 CSS3 中新增的一个属性，它可以将一段文本分割成多列，从而达到报纸、杂志等效果。它的语法如下：

column-count: ;
column-width: ;
column-gap: ;

其中 column-count 属性用于设置文本的列数，column-width 用于设置每列的宽度，column-gap 用于设置每列之间的间隙。

使用 CSS3 column 属性可以很方便地实现多列布局，而且还可以通过 column-rule 属性来设置每列之间的分割线。此外，CSS3 还提供了 break-before、break-after 和 break-inside 属性来控制文本在不同列之间的流动。

CSS3 column 还可以通过 column-fill 属性来设置文本在不同列之间是否平均填充；通过 column-span 属性来让元素跨越多个列；通过 column-rule-style、column-rule-width 和 column-rule-color 来设置每列之间的样式、宽度和颜色。

CSS3 column 的优势在于可以很方便地实现复杂的布局效果，而且代码量也相对少一些。但是由于不同浏览器对 CSS3 的支持情况不尽相同，所以使用时要注意兼容性问题。

CSS3 column-gap 属性

div
{
-moz-column-gap:40px; 
-webkit-column-gap:40px; 
column-gap:40px;
}

column-gap: length|normal;