Figma Design 教材 / Class LLL

約束：父框變大，子項該跟哪條邊？

固定邊距、中心偏移與比例，是不同承諾

改框後跑位時，先指出哪個框架是子項的直接父層，再比較左側／右側、雙邊、置中與縮放。用同一原稿的不同約束稿看邊距如何保留，分開一般框架、排版流及忽略自動排版的條件。

撰寫與維護：Class LLL · Lab Light Label｜預估閱讀 14 分鐘

開啟互動教材查看參考來源

閱讀目標

指出本次調整尺寸的框架與子層直接父層
比較單邊／雙邊／中心／比例各保什麼
分開水平及垂直約束
辨認一般流程與忽略自動排版的例外
區分框架尺寸、約束縮放與縮放工具 K

適用條件與學習範圍

同一個子層，父框加寬後要保左距、右距、中心偏移還是比例？如果改的是祖先框架，能直接拿它的尺寸套到子層嗎？

可直接閱讀；先辨認框架與其中子層。若把視覺重疊當父子歸屬，補讀框架／群組後返回。

能按直接父框架及所選軸的約束，預測子層位置或尺寸哪個會改；指出自動排版一般流程不使用相同控制、忽略自動排版則是明確例外。

固定原稿300×200、子層 40,50,80,40，無旋轉／文字／效果／min-max／參考線結合的幾何比較。切模式是在比多份預先設定稿，不模擬已調整尺寸時重新設定約束或連續回寫基準；真Figma結果仍依文件的其他條件核實。

原理與判斷

約束描述的是子層相對父框架的尺寸回應。單邊保距、雙邊保兩側、置中保中心偏移、縮放保所選軸比例，各有不同用途；它們不替內容決定閱讀目的，也不會自動安排所有兄弟。先說要保哪個關係，再改父框，比只記「選右側」更容易換尺寸判斷。巢狀結構需要逐層看：子層的直接父層是內層框架，內層又是外層的子層。外框變大，不代表內框尺寸必改；若直接父層沒變，不能把祖先的變化直接套進子層公式。也不要把一般自動排版流程與忽略自動排版例外混為一談。

先指出直接父層，再談調整尺寸

約束作用在框架裡的圖層；畫布上的物件沒有這個父框架條件。巢狀框架本身也能相對外層設約束，而其中子層又有另一份約束。要改哪一層、目前選到哪一層，會改變你正在問的問題。本站外層含內層，子層的直接父層固定是內層。內層在外層保左側／頂部與固定尺寸，所以只改外層時，子層不偷用外層寬高重算；改內層才套本頁的子層約束。這是一個明示條件，不是所有巢狀版面都如此。

單邊左側／右側、頂部／底部保留對哪條邊的距離

左側保相對左側位置，右側保相對右側位置；垂直的頂部／底部同理。Figma預設左側與頂部。當父框變大，保左距通常位置不變，保右距則需向右移，但不因此自動變寬。原稿框架寬300、子層左40寬80，所以右距180。父寬400時，右側稿左位置變140，寬仍80；左側稿左仍40。若改小到放不下，位置可超出框界，不能偷偷夾住座標而宣稱仍保原右距。

雙邊約束：兩側都保留，尺寸可能改變

左右雙邊保相對左右兩側的關係，父框架改寬時可能拉伸或縮小子層；上下雙邊對高度同理。適合你要保兩邊距而接受中間尺寸改變的情境，不代表文字或內部圖案就一定維持可讀。本例左右距40與180，父寬400時子層寬變180，左仍40。垂直上距50、下距110，父高300時高度140。本站只改矩形外框；真文字重排、圖像填充或元件內部規則須各自檢查。

置中保偏移，不等於強制放正中央

置中保留相對父框架中心的位置關係。只有原稿的子層中心剛好等於父中心，調整尺寸後才仍完全置中；本來偏左或偏上，不會因選置中就自動消除偏移。本例子層中心80、父中心150，水平偏移−70。父寬400時子層中心130、左90，仍保−70；這和右側稿左140不同。只看對稱原稿時多種規則可能碰巧同結果，應換一個不對稱尺寸或位置再判。

約束縮放：所選軸的尺寸與位置比例

縮放保相對父框架尺寸的比例：官方以子層寬70／父寬100，父寬200後子層寬140為例。水平與垂直可分開選，不因水平選縮放就保證整個物件長寬比不變。本站原稿X40、W80、父W300；父W400時X53.3、W106.7。若垂直仍頂部，Y50與H40不變，因此外框長寬關係會改。比例只描述幾何，不能把它當新增細節、字型可讀性或響應斷點。

尺寸、約束縮放與縮放工具 K分開

一般改框架 W／H會依子層現有約束回應；約束的縮放是相對父框的規則；工具列縮放或K則是按比例縮放物件的另一個操作。官方縮放工具文件還說它會忽略巢狀層約束，並縮放描邊與模糊等屬性。因此看見「縮放」不能略過作用範圍。本台只算矩形幾何約束，沒有重做K工具的字級／描邊／效果縮放、錨點或子像素輸出；需要比較原生操作時，保母稿並具名記錄用的是哪一項。

一般流程與忽略自動排版：不要一概禁用

一般自動排版流程子層用該系統的尺寸調整及排版規則，不能把本頁一般框架約束直接套過去。但官方指南 to auto 排版明確列例外：忽略自動排版讓子層留在父框架中、退出排版流，與兄弟互相忽略，仍可用約束；它舊名absolute 位置。本台選一般流程時停用約束控制且停止產出假結果；切忽略自動排版後才恢復比較。這沒有模擬整套流程、兄弟避讓或定位重歸屬，停止計算不代表原生內容不會移動。

群組、參考線與暫時忽略的條件

群組邊界由內容決定，不能把它當穩定父框架；官方說對群組套約束時實際作用於個別子層。排版參考線也有條件：延展參考可讓約束相對最近欄／列；固定參考線則仍以框架處理。本台未啟用這個結合，不能拿結果排除真文件中的參考線。原生調整尺寸時可用macOS Command／Windows Ctrl暫時忽略現有約束。本站按鈕只比較從原稿不套約束的子層，保留你選的規則；不模擬在任何中途位置按修飾鍵的完整歷史。

先設規則再改父框，公平比較同一原稿

要比較五種約束，應保同一原稿，先設某份子層約束再改父框；另一份從相同原稿設另一種。原生Figma在已調整尺寸的位置重新設規則，當下基準可能不同，不能把本站切模式後的跳動當成同一操作的保證。讀者終點是說清保距、保偏移或保比例的理由，換父尺寸再預測一次；如果目的其實是新增內容推開兄弟，應改查自動排版。如果只是不確定誰是父層，先回圖層面板及框架／群組，不靠反覆縮放猜。

步驟與觀察

保同原稿與父子條件
在可編輯的Figma Design副本中建立一般框架及矩形子層，記錄父寬高、子層 X／Y／W／H。先排除自動排版流程、旋轉、參考線結合或其他額外規則；這是隔離條件，不是要求拆掉正式稿結構。操作名稱對照（中文為本站教學譯名）：選取框架內子層 > 右側位置 > 約束（介面原文：選取Frame內child > 右側 Position > Constraints）約束 > Horizontal／Vertical（介面原文：Constraints > Horizontal／Vertical）自動排版子層 > 右側忽略自動排版（介面原文：Auto layout child > 右側 Ignore auto layout）
選子層設定兩軸約束
選框架內的子層，右側位置→約束，分別選水平與垂直。可用下拉或互動圖；官方列Shift可選雙邊。不要選到外框架後把其對祖先的約束當成子層對內層的規則。
只改直接父層的一個尺寸
先只改父框架寬，核子層左距、右距、位置與寬度；再用同原稿比較另一種水平約束。要查垂直就只改父高，不同時改很多參數。本站提供兩份作用層控制及數值／鍵盤替代，不強迫拖曳。
換不對稱條件辨認置中與縮放
不要只用正中央稿。先記中心偏移，再比較置中稿和縮放稿；說出保的是偏移還是位置／尺寸比例。原生比較需回相同原稿先設約束再調整尺寸，不在已改的位置改規則後期待與本站一樣。
遇自動排版先查子層是否在流程
一般流程先查尺寸調整及排版；若本來就是浮動層，可依需求選子層並在右側忽略自動排版退出流程，再設定約束。這是結構決策，需檢查是否會與兄弟重疊；不為顯示控制就任意切正式稿。
補讀邊界後回來驗預測
補讀框架／群組確認資料歸屬，或補讀自動排版分清內容流。返回本台保比較稿的父框、約束與作用層；用另一個尺寸說出預測，再回原生Figma按實際字型、參考線及內部規則核實。

常見問題

改框後跑位，卻不知道改的是哪個父層

從圖層面板找子層直接父層，再看它與祖先各有什麼約束；外層變化不能跳過內層尺寸直接套到子層。

選置中就以為會自動放正中

核原稿中心偏移；置中保相對中心關係，不抹除原偏移。用不對稱原稿再比較。

選雙邊後圖形變寬，卻以為是按比例縮放

雙邊保兩邊距，尺寸變化未必保長寬比；再核內部文字／圖形與所選軸，不把外框拉伸當K工具縮放。

一般自動排版子層找不到約束，就認為全部都不支援

先分一般流程、忽略自動排版子層及auto-layout 框架本身對外層的身份；例外有明確條件，不一概禁用。

切規則後結果與本站不同

核是否從同一原稿先設規則再調整尺寸，並查參考線結合、旋轉、內部尺寸及中途重設基準；本站是固定原稿比較，不承諾完整編輯歷史。

想讓長文字推開兄弟，卻反覆改約束

這是內容流與尺寸責任問題，另查自動排版／文字尺寸；約束本身不會替兄弟排列或驗可讀性。

適用範圍與證據

原教材查核日期：2026-10-22 適用範圍：Figma Design；官方約束列所有方案、可編輯，縮放工具列所有方案及編輯存取權；Windows／macOS修飾鍵按具名功能核對。一般流程與忽略自動排版例外分開，未自推測試版資格。來源狀態：2026-10-22新核Constraints、auto layout的Ignore段及Scale tool三文；guides結合沿同日FG12新核G04。概述文對auto-layout child的泛稱由Ignore auto layout細分補足，不略掉官方例外。示意限制：原創父框伸縮台，固定原稿及逐軸保距／中心偏移／比例模型；外／內層作用對象與子層直接父層分開。圖、錨線、邊距及讀數由同份結果驅動；流程停止計算，非假造自動排版。切模式比較預設定稿，不重現原生中途rebase／縮放 K。原生軟體實測：未原生Figma建立約束、忽略自動排版、參考線結合或輸出實測；官方查核與本站公開行為分開。學習成效驗證：未真人判斷或學習遷移成效實測。

參考來源

來源依原教材逐頁維護；本次建立閱讀網址不代表重新完成原生軟體或真人學習測試。如遇版本差異或內容錯誤，歡迎來信提出具體段落與版本。