CSS3多列布局(浏览器兼容)
columns属性
简写属性
- column-count属性:定义列的数量
- column-width属性:定义列的宽度
column-count属性(列的数量)
用于设置列的数量或者允许的最大列数
auto
:默认值,用于表示列的数量由其他CSS属性决定number
:必须是正整数,用于表示定义列的数量
column-width属性(列的宽度)
用于设置列的宽度或者列的最小宽度
auto
:默认值,用于表示列的宽度由其他CSS属性决定length
:必须是正整数,用于表示定义列的宽度
实例
.parent {
/* column-count:4 ;
column-width: 300px; */
columns: 4 300px;
}
.col1,
.col2,
.col3,
.col4 {
height: 300px;