HTML-CSS（五十一）column分栏布局
作者：互联网
column-count：number; 分栏个数
column-width：number px; 分栏宽度
column-gap: number px ; 分栏的间距
column-rule: numberpx(宽度) color（颜色） 边线形状（与border设置边框一样）
column-span：all/默认不写；合并分栏（独占一行，在需要独占一行的元素上引用该属性）
注意：当我们设置分栏的宽度和个数时，它们之间是有冲突的。要么你就写分栏的个数，要么就写分栏的宽度
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
div{
width: 400px;
height: 200px;
border: 1px solid black;
/* column-count: 3; */
margin: 0 auto;
column-width: 50px;
column-gap: 20px;
column-rule: 2px dashed #00FFFF;
}
h2{
column-span: all;
text-align: center;
}
</style>
</head>
<body>
<div id="">
<h2>新闻</h2>
1印度航空计划增加直飞美国航班431省区市新增13例确诊均为
境外输入2梅西将接种中国新冠疫苗参加美洲杯热5印度部长视
察医院劝民众向神祈祷3中亚两国激烈交火 居民蹲墙后围观
</div>
</body>
</html>
标签：column,个数,number,width,HTML,五十一,宽度,分栏 来源： https://blog.csdn.net/weixin_44730244/article/details/116420468