回應式混搭
回應式混搭可讓您使用進階版面配置設定來排列容器內的項目。這些設定以針對階層式樣式表 (CSS) 的彈性方塊版面配置模組 (flexbox) 為基礎。
您可使用 Flexbox 式容器執行下列操作：
• 垂直或水平對齊容器中的項目
• 根據可用空間拉伸或換行容器中的項目
• 設定固定容器高度或寬度
• 當混搭中包含多個容器時，定義 flexbox 的增長與收縮比例
• 使用自訂 CSS 規則來定位項目
• 使用「樣式內容」面板自訂容器的外觀與風格
您可以使用容器作為列與欄來建構混搭。容器中的項目會根據可用空間來展開或收縮。建立混搭時，可以使用「版面配置」面板來控制容器中各項目的定向、對齊、拉伸與換行等選項。您可針對混搭中的每個容器定義特定版面配置規則。
建立回應式混搭
1. 從 Composer 中，按一下 > 。「新混搭」視窗即會開啟。
2. 選取「回應式」，然後按一下「確定」。
3. 輸入混搭名稱，然後按一下「儲存」。
將容器新增至混搭
依預設，空白回應式混搭具有一個容器。欲新增多個容器到混搭，請執行下列操作：
1. 選取混搭中的容器。
2. 在「版面配置」面板中的「新增容器」部份下，選取一個選項來在所選容器的左側、右側、上方或下方新增容器。
3. 視需要重複步驟 1 與 2 來新增容器至混搭。
4. 按一下「儲存」。
將項目新增至容器
建立「混搭」版面配置之後，即可開始將項目新增至容器。項目會以新增時的順序排序。欲新增某個項目，請將此項目從「小器具」面板拖曳到混搭中的任何容器上。
您可以將回應式與非回應式小器具新增至同一容器。回應式小器具會填充空容器內的所有可用空間。當您新增非回應式小器具時，會將回應式小器具設定為預設大小。您可以使用「版面配置」面板來控制容器內項目的對齊方式。如需有關排列項目的詳細資訊，請參閱
排列回應式容器中的項目。
使用靜態定位
當將定位設定為「回應式」時，會根據容器版面配置規則來排列小器具。當將定位設定為「靜態」時，會禁用回應式版面配置規則，您可以將小器具放置在容器內的任何位置。欲定位小器具，請按一下並手動拖曳它，或針對靜態版面配置使用可用的對齊指令。
自訂容器大小
您可以使用下列選項之一來控制混搭中每個容器的大小：
• 「回應式」- 將容器設為回應式。
• 「固定大小」- 指定容器的固定大小。
• 「大小範圍」- 根據定義的最小值與最大值範圍來設定容器大小。