使用css进行文章简单的多栏排版

**

• 案例中主要使用到column-count和column-gap来设置列数和列之间的间隔

**
例：

#text1{
   
border:1px solid #930;
line-height:1.5em;/*设置行高*/
/*em为一种测量单位，12点活字*/
-webkit-column-count:2;/*网站规定元素应该被分隔的列数为2*/
-moz-column-count:2;/*-column-count规定元素应该被分隔的列数*/
column-coumn:2;
-webkit-column-gap:4em;/*网站规定列之间的间隔*/
-moz-column-gap:4em;
column-gap:4em;/*规定列之间的间隔*/
}

• 在列数间隔中可设置多种样式

例1：

#text1{
   
border:1px solid #930;
line-height:1.5em;/*设置行高*/
/*em为一种测量单位，12点活字*/
-webkit-column-count:2;/*网站规定元素应该被分隔的列数为2*/
-moz-column-count:2;/*-column-count规定元素应该被分隔的列数*/
column-coumn:2;
-webkit-column-gap:4em;/*网站规定列之间的间隔*/
-moz-column-gap:4em;
column-gap:4em;/*规定列之间的间隔*/