CSS3多列column-count属性

百变鹏仔 3个月前 (09-20) #CSS

文章标签属性

css3的多列column-count属性用于计算元素应该被分成的列数。

您可以尝试运行以下代码来使用CSS实现column-count属性：

示例

演示

<html>   <head>      <style>         .multi {            /* Column count property */            -webkit-column-count: 4;            -moz-column-count: 4;            column-count: 4;            /* Column gap property */            -webkit-column-gap: 40px;            -moz-column-gap: 40px;            column-gap: 40px;            /* Column style property */            -webkit-column-rule-style: solid;            -moz-column-rule-style: solid;            column-rule-style: solid;         }      </style>   </head>   <body>      <div class = "multi">         Tutorials Point originated from the idea that there exists a class of readers who respond         better to online content and prefer to learn new skills at their own pace from the comforts         of their drawing rooms. The journey commenced with a single tutorial on HTML in 2006 and         elated by the response it generated, we worked our way to adding fresh tutorials to our         repository which now proudly flaunts a wealth of tutorials and allied articles on topics         ranging from programming languages to web designing to academics and much more.      </div>   </body></html>

输出

文章推荐

CSS3多列column-count属性

示例

输出

css如何让导航栏变透明

css 怎么去除a标签的手形

css里怎样设置字体大小和字体颜色

css如何固定导航栏

css边框变圆角边框怎么写