分欄是比較好用的一個布局組件，其最大的作用是排版頁面，可以將相同結構不同內容的區域分割顯示。下面來看下分欄的一些功能。

預置分欄

基于響應式桌面布局原理，在cool site360中欄使用了預定義的網格類， row 可用于快速創建網格布局。

桌面端定義欄十款排版樣式。

iPad端和手機端根據PC端適配樣式，注意：調節PC端分欄會同時影響手機端和iPad端，而調節手機端不影響PC端。具體的適配規則請看教程：響應式布局調整。

以四欄布局為例：

PC端設置為四欄布局，效果如下：

平板端設置為四欄布局，效果如下：

手機端設置為豎排布局，效果如下：

 

自定義分欄

除了使用預定的分欄樣式，cool site360還支持自定義分欄，只需要通過CSS樣式設置面板為分欄中的每一列自定義百分比就可以了，如以下是一個布局為四欄2：3：3：2的列設置。

 

列屬性設置

設置分欄后，同時也會生成相應數量的列，在元素設定面板可以對列進行移動、刪除操作。

按住列可拖動次序。如列2與列3互換位置。效果如下：

移動前：

移動后：