回應式版面
AEM可讓您使用 配置容器 元件，為您的頁面設定回應式配置。
TIP- 對於網站管理員，在設定配置容器和配置模式檔案中會說明如何設定網站的配置容器的詳細資訊。
- 開發人員可在回應式設計檔案中瞭解佈局容器和回應式格線的詳細資訊，其中提供設計網站時使用佈局容器和回應式格線的相關提示。
- 提供水準貼齊格點，以及可並排將元件置入格點，並定義它們何時應摺疊/重排。
- 使用預先定義的中斷點（例如，手機、平板電腦等），讓您為相關裝置/方向定義內容的必要行為。
- 例如，您可以自訂元件大小，或是否在特定裝置上可看見元件。
- 可巢狀化以允許欄控制項。
之後，使用者可以使用模擬器檢視特定裝置內容的呈現方式。
AEM使用一組機製為頁面實現回應式佈局：
利用這些回應式格點機制，您可以：
- 根據裝置寬度（與裝置型別和方向相關），使用中斷點來定義不同的內容配置。
- 使用這些相同的中斷點和內容版面配置來確保您的內容會回應案頭上瀏覽器視窗的大小。
- 使用水準靠齊格點，讓您可以在格點中放置元件、視需要調整大小，以及定義它們何時應該摺疊/重排成並排或上下對齊/重排。
- 隱藏特定裝置配置的元件。
- 實現欄控制。
根據您的專案，可能會將「版面容器」用作頁面的預設段落系統，或用作可透過元件瀏覽器新增至頁面的元件（或同時用作兩者）。
NOTE配置定義、裝置模擬和中斷點
建立網站內容時，您想要確保內容顯示方式適合用來檢視內容的裝置。
AEM可讓您根據裝置的寬度定義版面：
-
模擬器可讓您在多種裝置上模擬這些版面。 除了裝置型別之外，由 旋轉裝置 選項選取的方向，可能會隨著寬度變更而影響選取的中斷點。
-
中斷點是區分配置定義的點。
- 它們實際上會定義任何使用特定版面配置之裝置的最大寬度（以畫素為單位）。
- 中斷點通常適用於一系列選取的裝置，視其顯示器的寬度而定。
- 中斷點的範圍會向左延伸，直到下一個中斷點為止。
- 您無法明確地選取中斷點，選取裝置和方向將會自動選取適當的中斷點。
沒有特定寬度的裝置 案頭 與預設中斷點（亦即高於上次設定的中斷點）有關。
NOTE使用模擬器時，您可以選取特定裝置來模擬和定義版面，相關的中斷點也會反白顯示。 您所做的任何配置變更都適用於中斷點套用的其他裝置。 亦即，任何位於作用中中斷點標籤左側、但位於下一個中斷點標籤之前的裝置。
例如，當您選取裝置 iPhone 6 Plus （定義寬度為540畫素）進行模擬和配置時，也會啟用中斷點 電話 （定義為768畫素）。 您對 iPhone 6 所做的任何配置變更都適用於 電話 中斷點下的其他裝置，例如 iPhone 5 （定義為320畫素）。
選取要模擬的裝置
-
開啟進行編輯所需的頁面。 例如：
http://<host>:<port>/editor.html/content/wknd/en/sports/la-skateparks.html -
從頂端工具列選取 模擬器 圖示：
-
模擬器工具列隨即開啟。
模擬器工具列會顯示其他版面配置選項：
- 旋轉裝置 — 可讓您將裝置從垂直（縱向）方向旋轉至水準（橫向）方向，反之亦然。
- 選取裝置 — 從清單中定義要模擬的特定裝置（請參閱下一個步驟以取得詳細資料）
-
若要選取要模擬的特定裝置，您可以：
- 使用「選取裝置」圖示，並從下拉式選取器選取。
- 在模擬器工具列中選取裝置指示器。
-
選取特定裝置後，您可以：
- 檢視所選裝置的作用中標籤，例如 iPad。
- 檢視適當中斷點的作用中標籤，例如 平板電腦。
- 藍色虛線代表所選裝置的 摺頁 (此處為橫向的 iPhone 6 Plus)。
- 摺頁也可以視為內容的分頁符號（不要與中斷點混淆）。 這項顯示是為了方便使用者在捲動前在裝置上看到的內容部分。
- 如果模擬的裝置高度高於熒幕大小，則不會顯示折線。
- 顯示摺頁是為了方便作者使用，不會顯示在已發佈的頁面上。
新增版面容器及其內容（編輯模式）
配置容器 是段落系統，該系統：
- 包含其他元件。
- 定義版面。
- 回應變更。
NOTE-
「配 置容器 」是元件瀏覽器中的標準 元件。從這裡，您可以將其拖曳至頁面上的必要位置，之後您會看到 將元件拖曳至此處 預留位置。
-
然後，您可以將元件新增至版面容器。 這些元件將儲存實際內容：
