20-CSS多列布局

多列布局

多列布局指的是可以将文本内容分成多块，然后让这些块并列显示，类似于报纸、杂志的排版样式

添加在父级元素上的属性：

• column-count 分栏的个数

• column-width 分栏的宽度

  一般count和width不会一起设置，根据具体需要选择

• column-gap 分栏的间距

• column-rule 分栏的边框（属性值跟border属性写法一样）

添加在子级元素上的属性：

• column-span 合并分栏（1/all，默认是1，all可以跨过所有的列）
• break-inside 列或区域发生中断时候的元素该如何表现（auto / avoid）

案例：瀑布流照片墙的实现