css布局 分栏布局介绍


1. 设置栏数

语法:

column-count: 数值;


2. 设置每栏的宽度

语法:

column-width: 数值+单位;

注: column-count 和 column-width 设置其中一个即可


3. 设置栏间距

语法:

column-gap: 数值+单位;


4. 设置栏间隔线

语法:

column-rule: 宽度  线型(solid/dashed/dotted)  颜色;

eg:

column-rule: 2px solid red;


5. 设置元素是否跨栏显示

语法:

column-span: all(跨栏显示)  |  none(不跨栏显示);

注: 该属性给需要跨栏显示的元素添加;

火狐不支持该属性。


本文链接:https://my.lmcjl.com/post/20960.html

展开阅读全文

4 评论

留下您的评论.