css3-columns多列布局

/*css3中的布局*/
.wrapper{
   margin:auto;
   width:300px;
   height:200px;
   border:2px dotted blue;
   -webkit-columns:15px 3;/*表示多列布局，每一列15px 有3列，内容多于3列则该参数失效！例如对一篇文章可以进行多列布局显示*/
     
     -webkit-column-count:3;
     -webkit-column-width:15px;/*将width和count属性拆开来单独使用，弱拆开且同时使用，浏览器根据具体情况会可能会使某一属性失效*/ 
     -webkit-column-gap:2em;/*设置列间距为2字符，不设置默认情况下为1字符间距*/    

    -webkit-column-rule:2px    solid red;/*定义列与列之间的分割线为2px  实体  红色 该分割线不占用空间位置 like a ghost*/
    
}
h2{
   text-align:center;/*文本居中显示*/
   -webkit-column-span:all;/*令h2横跨所有列*/
}