自助建站、網頁設計教程

通過學習路線圖,零基礎學習專業網頁設計、小程序UI設計技巧,成就網頁設計高手。

布局組件—欄

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

預置分欄

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

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

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

以四欄布局為例:

PC端設置為四欄布局,效果如下:

平板端設置為四欄布局,效果如下:

手機端設置為豎排布局,效果如下:

 

自定義分欄

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

 

列屬性設置

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

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

移動前:

移動后:

提交成功,謝謝反饋!

請完整填寫表單的信息后,再進行提交!

网上棋牌作弊是真的吗