Document
* {
margin: 0;
padding: 0;
}
.box {
height: 400px;
background-color: pink;
/* 划分列数 */
column-count: 4;
/* 调整列宽度 */
column-width: 400px;
/* 调整列间隔 */
column-gap: 10px;
/* 添加列间隔线 */
column-rule:2px dashed 30px blue ;
/* 修改列高度 */
column-fill: balance;
/* column-fill:
auto:先填充父元素所在的第一列高度，
填充满后，在取填充第二列
balance:高度均分
*/
}
h2{
/* 跨列 */
column-span: all;
text-align: center;
break-inside:auto;/*子标签换列时是否可中断 属性值：auto可中断、avoid不可中断*/
}
</style>
