多列布局

column-count
分割的列数
     默认auto,可由其他属性来计算
 
column-width
设置每一列的宽度
     默认值为auto,由其他属性来决定,例如列数
 
column-gap
列间距
     默认为1em
 
column-rule-color
分割线颜色
 
column-rule-style
分割线的样式
 
column-rule-width
指定列分割线的宽度
 
column-span
指定内容块跨越的列数
all
内容块跨越页面上的所有列。内容块前面声明的所有内容都显示在该内容块前面。
"1"
这是默认值。内容块不跨越多个列。
 
column-fill
指定在多列元素中内容流如何影响列长度
balance
所有列将被依次填充进来,并且使列的长度尽可能平衡,具体取决于其他列属性值。
auto
这是默认值。所有列将被依次填充进来,并且列的长度可能会不同,具体取决于其他列属性值。
 
 
break-after
指定该内容开始之前是否分列、分页
page
该列后面强制分页。
column
该列后面强制分列。
avoid-page
避免在生成框的后面强制分页。
avoid-column
避免在生成框的后面强制分列。
 
break-before
指定该内容结束后是否分列、分页
page
强制分页。
column
强制分列。
avoid-page
避免强制分页。
avoid-column
避免分列。
 
break-inside
指定内容是否允许被分列分页显示
avoid-page
避免在生成框的内部强制分页。
avoid-column
避免在生成框的内部强制分列。
 
缩写:
 
columns: 200px 4;
column-width 和 the column-count  的缩写
 
 
column-rule: 1px solid black
column-rule-width、column-rule-style 和 column-rule-color 缩写
原文地址:https://www.cnblogs.com/chuangweili/p/5166218.html