使用float属性或position属性进行页面布局时有一个比较明显的缺点，就是多列的div元素间是各自独立的，因此如果在第一列div元素中加入一些内容，将会使得两列元素的底部不能对齐，导致页面中多出一块空白区域。这种情况在多列文章排版时显得更为明显，而且问题更多，此时需要用户手动调整两列文本内容，这种操作会相当麻烦。

Columns是多列布局特性的基本属性，该属性可以同时定义列数和每列的宽度。Columns属性初值根据元素个别属性而定，适用于不可替换的块元素、行内元素和单元格，但是单元表格元素除外。

Columns的基本语法如下：

Columns： (定义每列的宽度)  (定义列数)。

Columns:250px 3 ;(分成3栏  每栏宽度为250像素)

在网页中显示大量正文文字时使用浮动布局实现这种效果往往会存在两个难题：一是多列浮动显示不容易进行控制；二是多列显示后各列内容无法互通，这样就为后期编辑带来诸多不便。如果使用CSS3多列布局特性，这些问题就可以轻松解决。

columns-width和columns-count 可以单独拿出来使用也可以与其他多列布局属性配合使用。

columns-width属性定义单列显示的宽度，语法如下：

columns-width：  auto;

：由浮点数字和单位标识符组成的长度值。不可为负值。

auto:根据浏览器计算值自动设置。

columns-width属性初始值为auto，适用于不可替换的块元素、行内块元素和单元格，表格元素除外。

columns-width超出所设置的宽度时，则会自动以多列进行显示。

columns-count 属性定义显示的列数，语法如下：

columns-count:  auto;

:定义栏目的列数，取值为大于0的整数。如果columns-width和columns-count属性没有明确值，则该值为最大列数。

auto:根据浏览器计算值自动设置。

当columns-count:3；去定义网页（body）列数为3列，则不管浏览器的窗口怎么调整，页面内容总是遵循3列布局。