列数 | column-count
该column-countCSS属性描述元素的列数。
/* <integer> value */
column-count: 3;
/* Keyword value */
column-count: auto;
/* Global values */
column-count: inherit;
column-count: initial;
column-count: unset;Initial value | auto |
|---|---|
应用对象 | Block containers except table wrapper boxes |
是否可继承 | no |
媒体 | visual |
计算值 | as specified |
动画类型 | an integer |
规范顺序 | per grammar |
语法
值
auto是一个关键字，用来表示由其他CSS属性指定
的列数量, 例如?column-width.
<integer>是个严格的正数?<integer>，用来描述元素内容被划分的理想列数. 假如?column-width也被设置为非auto值, 此参数仅表示所允许的最大列数.?
形式语法
<integer> | auto实例
.content-box {
border: 10px solid #000000;
column-count: 3;
}规范
Specification | Status | Comment |
|---|---|---|
CSS Multi-column Layout ModuleThe definition of 'column-count' in that specification. | Candidate Recommendation | Initial definition |
浏览器兼容性
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|---|
Basic support | (Yes)-webkit 50.01 | (Yes)-webkit (Yes) | 1.5 (1.8)-moz 52 (52)2 | 10 | 11.10 | 3.0 (522)-webkit |
on display: table-caption | (Yes) | (Yes) | 37 (37) | (Yes) | (Yes) | (Yes) |
Feature | Android | Android Webview | Edge | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|---|
Basic support | (Yes) | (Yes) 50.01 | (Yes)-webkit (Yes) | 1.0 (1.8)-moz 52.0 (52)2 | (Yes) | (Yes) | (Yes) | ? 50.01 |
on display: table-caption | (Yes) | ? | (Yes) | 37.0 (37) | (Yes) | (Yes) | (Yes) | ? |
本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com
