定心框總結

這 定心盒 是一個 3 x 3 的網格，出現在 風格面板 > 佈局 當顯示器配置為彎曲或網格時。居中框可用作 Flex 父元件或網格的視覺表示，以在其父元件內快速對齊 Flex 和網格子元件。

首先，選擇居中框 細胞 您希望將內容與其對齊，或點擊內容的任何部分 定心盒 專注於它並使用鍵盤上的箭頭鍵在其單元格中移動。您可以雙擊居中框單元格和/或使用快速方法來快速對齊 Flex 和網格子項目。

當您與居中框互動時，螢幕會鏡像您的調整和 X 和 是 軸下拉清單得到更新以顯示目前的對齊配置。

快速方法

柔性

• 建立理由（例如，justify-content） 之間的空間：雙擊居中框單元格或 命令 （在 Mac 上）或 控制 （在 Windows 上）+ 點選居中框 細胞
• 建立對齊（例如，align-items）以 拉緊: 選項 （在 Mac 上）或 替代 （在 Windows 上）+ 點選居中框 細胞

了解有關對齊彈性子項的詳細資訊。

網格

• 建立理由（例如，justify-items） 拉緊：雙擊居中框單元格或 命令 （在 Mac 上）或 控制 （在 Windows 上）+ 輕敲 一個定心盒 細胞
• 建立對齊（例如，align-items）以 拉緊: 選項 （在 Mac 上）或 替代 （在 Windows 上）+ 點選居中框 細胞

了解有關對齊網格子項目的更多資訊。

評論： 某些對齊選項不僅可以透過居中框訪問，還可以透過 X 軸和 Y 軸下拉選單存取。