Studio 編輯器：設定元件大小
5 分鐘
在設計網站時，您會希望確保網站在每個畫面尺寸上看起來都很棒。在 Studio 編輯器中，您只需以像素*設定大小，回應式行為就會處理其餘部分。
大多數元件都具備預設行為（例如：按比例調整），用以控制在其他畫面上調整大小的方式。您可隨時將預設行為更改為更符合需求的行為。
px* 是一種流動尺寸單位，相對於頁面的編輯大小。
提示：
您可針對各個 斷點 設定元件的大小和回應式行為。
調整元件大小
在畫布上選擇元件並拖曳側邊把手即可縮小或放大。這會設定元件在目前斷點上的顯示方式。
在檢驗器面板中，可以檢查元件的精確寬度與高度。若有需要，可以輸入寬度／高度數值。
讓檢驗器為您進行計算：
為方便起見，輸入大小數值時可使用加（ + ）、減（ - ）、乘（ * ）和除（ / ）。例如，在目前寬度旁加上 *3，即可讓元件寬度變為 3 倍。
調整大小時遇到問題？
請觀看此疑難排解影片，了解方法以解決區段和容器無法調整大小的問題。
調整媒體元件大小
調整媒體元件（如圖片或影片）大小時，可鎖定外觀比例，讓寬度與高度始終保持比例。
這表示當更改寬度時，高度會自動調整（反之亦然），以維持元件的原始形狀。
哪些媒體元件包含此選項？
若要鎖定外觀比例：
- 選擇相關媒體元件。
- 點擊右上方「開啟檢驗器」箭頭 Open Inspector
。
- 點擊 大小 下方的 鎖定外觀比例 圖示
。 - 透過以下任一方式調整元件大小：
- 在檢驗器中輸入寬度／高度金額（另一個數值將自動調整）。
- 拖曳畫布上元件周圍的把手。
請注意：
進階設定模式不提供此選項。
以 px* 設定大小
px* 是 Studio 編輯器中的一種流動要比較的項目。這讓您能使用熟悉的測量單位（像素）編輯大小，而後台的實際測量值則是回應式的。
換句話說，您在畫布上以像素設計元件大小，而元件會保持回應式。具體金額與尺寸單位取決於所選的回應式行為。將滑鼠游標懸停在 px* 上即可查看 Calc 計算方式以及正在使用的回應式尺寸單位。
在下方範例中，容器在目前畫布上的寬度為 330 px*。實際單位為百分比，因此寬度是相對的（佔每個畫面的 25.8％）。
px* 與 px 有何不同？
兩者皆可讓您以像素進行編輯，然而：
- px* 代表所見的大小與目前操作的斷點相關。
- px 則代表大小在各斷點間皆為固定。
選擇元件的回應式行為
將元件新增至頁面時，該元件已內建回應式行為。這表示無需擔心元件在不同畫面上的呈現效果──回應式行為可確保元件自動調整大小。
然而，若發現更適合設計的選項，您可切換回應式行為。
可用行為之間有何不同？
請注意：
選擇的回應式行為會影響使用的尺寸單位。例如，選擇「固定」回應式行為會將要比較的項目從 px* 更改為像素。
若要選擇不同的回應式行為：
- 選擇相關斷點。
- 選擇元件。
- 點擊編輯器右上方「開啟檢驗器」圖示 。
- 從 回應式行為 下拉式選單中選擇一個選項。
已上線網站出現非預期的間隙？
請觀看 這段疑難排解影片 了解回應式行為如何影響並解決此問題。
使用進階尺寸測量
檢驗器中的進階設定可讓您針對每個斷點更深入地自訂元件大小。此模式不使用像素*並選擇回應式行為，而是讓您查看我們在後台使用的要比較的項目（例如：像素、％、vh）並根據需求進行調整。
有哪些可用的測量單位？
啟用進階設定將套用至所選的特定元件及其所有斷點。該元件會保持啟用進階設定模式以便存取，但您可隨時將其停用。
若要存取並編輯進階尺寸設定：
- 前往編輯器。
- 選擇相關元件。
- 點擊編輯器右上方「開啟檢驗器」圖示 。
- 點擊 大小 旁邊的 尚有...項操作 圖示
。 - 開啟 進階設定 切換開關。
- 根據需要編輯大小：寬度、高度以及最小和極致金額。
提示： 點擊檢驗器中的單位即可切換到不同的單位（例如：從像素切換到 ％）。這會開啟該元件可用要比較的項目的清單。
設定區段高度：
不建議以像素設定高度，因為這可能導致元件無法按預期顯示。例如，元件可能會溢出或顯現裁切狀態。
設定尺寸偏好設定
為正在設計的網站選擇大小偏好設定。若您喜歡使用進階 CSS 要比較的項目，可在整個編輯器中啟用進階設定。或者，若您偏好針對每個元件選擇大小模式，也可以保持這種方式。
若要為網站設定尺寸偏好設定：
- 點擊左上角的 Wix Studio 圖示
。 - 將滑鼠游標懸停在 檢視 上。
- 將滑鼠游標懸停在 大小偏好設定 上。
- 選擇偏好設定：
- 一律顯示進階：檢驗器中的大小一律設定為進階。
請留意： 此模式會停用將特定元件從進階設定切換回來的選項。 - 針對每個元件設定：您可為每個元件設定大小偏好設定。
- 一律顯示進階：檢驗器中的大小一律設定為進階。
常見問題
點擊下方問題以瞭解更多尺寸設定資訊。
何時應使用進階設定？
與 Wix 應用程式相關的元件是否提供所有的回應式行為？
已將區段設定為按比例調整，但元件卻沒有隨之縮放，為什麼？
為什麼無法使用檢驗器面板調整特定元件的大小？
為何圖片或影片在不同畫面尺寸下無法正確縮放？
如何修正行動裝置上的元件重疊問題？