首页 > 其他 > 详细

多列布局——Columns

时间:2016-09-05 13:48:20      阅读:191      评论:0      收藏:0      [点我收藏+]

为了能在Web页面中方便实现类似报纸、杂志那种多列排版的布局,W3C特意给CSS3增加了一个多列布局模块(CSS Multi Column Layout Module)。它主要应用在文本的多列布局方面,这种布局在报纸和杂志上都使用了几十年了,但要在Web页面上实现这样的效果还是有相当大的难度,庆幸的是,CSS3的多列布局可以轻松实现。接下来咱们一起学习多列布局相关的知识。

语法:

columns:<column-width> || <column-count>

多列布局columns属性参数主要就两个属性参数:列宽和列数。

参数

参数说明

<column-width>

主要用来定义多列中每列的宽度

<column-count>

主要用来定义多列中的列数

举例:要显示2栏显示,每栏宽度为200px,代码为:

columns: 200px 2;

到目前为止大部分主流浏览器都对其支持:

技术分享

多列布局——Columns

原文:http://www.cnblogs.com/gulan/p/5841775.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!