web前端学习

概述

把一段文字分成多列的相关属性

1.多列数column-count

将元素中的文本内容设为多列（多栏）显示。属性名称：column-count。属性的值：列数。

北京时间2023年10月26日11时14分，搭载神舟十七号载人飞船的长征二号F遥十七运载火箭在酒泉卫星发射中心点火发射，约10分钟后，神舟十七号载人飞船与火箭成功分离，进入预定轨道，航天员乘组状态良好，发射取得圆满成功。

	
#column_test1{
	column-count: 2;
}

2.列间隔column-gap

设置多列文本的列间距。属性名称：column-gap 属性的值：列之间的间隔值

北京时间2023年10月26日11时14分，搭载神舟十七号载人飞船的长征二号F遥十七运载火箭在酒泉卫星发射中心点火发射，约10分钟后，神舟十七号载人飞船与火箭成功分离，进入预定轨道，航天员乘组状态良好，发射取得圆满成功。

	
#column_test2{
	column-count: 2;
	column-gap: 50px;
}

3.列间分割线column-rule

设置多列文本之间分隔线的宽度、线型、颜色。属性名称：column-rule。属性的值：分隔线宽度分隔线线型分隔线颜色。

北京时间2023年10月26日11时14分，搭载神舟十七号载人飞船的长征二号F遥十七运载火箭在酒泉卫星发射中心点火发射，约10分钟后，神舟十七号载人飞船与火箭成功分离，进入预定轨道，航天员乘组状态良好，发射取得圆满成功。

	
#column_test3{
	column-count: 2;
	column-rule: 2px dotted #aa00ff;
}