css 多行多列 CSS | 多列 (CSS | Multiple Columns)This CSS property allows to define column layout of contents and wrap them into multiple columns with gap and rules between them. 此CSS属性允许定义内容的列布局，并将它们包装成具有...
css 多行多列
CSS | 多列 (CSS | Multiple Columns)
This CSS property allows to define column layout of contents and wrap them into multiple columns with gap and rules between them.
此CSS属性允许定义内容的列布局，并将它们包装成具有间隔和规则的多个列。
There are multiple column properties which are listed below,
下面列出了多个列属性 ，
column-count
列数
column-gap
列间隙
column-rule-style
列规则样式
column-rule-width
列规则宽度
column-rule-color
列规则颜色
column-rule
列规则
column-span
列跨度
column-width
列宽
Let's discuss each property one by one.
让我们逐一讨论每个属性。
1)列数属性 (1) column-count property)
The column-count property is used to count the number of columns an element should be divided into.
column-count属性用于计算元素应划分为的列数。
Syntax:
句法：
Element {
column-count: 4;
}
Example:
例：
<!DOCTYPE html>
<html>
<head>
<style>
div {
column-count: 4;
}
</style>
</head>
<body>
<div>
this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property this is multiple column CSS property
</div>
</body>
</html>
Output
输出量
In the above example, the content is divided into 4 columns.
在上面的示例中，内容分为4列。
2)列间隙属性 (2) column-gap property)
The column-gap property is used to specify the space or gap between the columns.
column-gap属性用于指定列之间的间隔或间隙。
Syntax:
句法：
Element
最低0.47元/天 解锁文章
702
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
