header-logo
開始使用 Wix以 Wix 建立網站和商家。歡迎使用我們的 AI 工具來建立網站、自訂範本或雇用專業人員,樹立網上形象。
建立網站了解如何以 Wix 工具建立並管理網站。您也可在此找到更多關於 AI 工具、網站訪客隱私權和無障礙的資訊。
帳戶與帳單檢閱帳戶設定,設定訂閱與方案,查看請款單。
使用 Wix 行動應用程式歡迎使用 Wix 行動應用程式,隨時隨地處理業務,並以專屬應用程式吸引網站會員互動。
連結網域以逐步指南了解如何購買、連結或轉移網站網域,並學習如何確保網站資料安全。
Studio、夥伴與 Enterprise善用 Studio 或 Enterprise 帳戶,以進階功能提升效率。
需要協助?尋找網站與技術支援,了解已知問題,或聯絡我們要求協助。
placeholder-preview-image
Wix Learn以課程和教學加強技能。
Wix 部落格學習網頁設計、行銷等範疇的秘訣。
SEO 學習中心學習如何提升來自搜尋引擎的自然網站流量。
網站開發以全端平台建立自訂網站。
聘用專業人士與專家配對,幫助實現目標。
placeholder-preview-image

Wix 編輯器:變更背景圖片縮放比例、位置和不透明度

新增背景圖片可讓頁面脫穎而出。您可透過一些細微調整來打造專屬風格。例如,您可以變更圖片的縮放比例和位置、新增捲動效果,或調整圖片本身的不透明度。

變更頁面背景圖片不透明度

不透明度與透明度相反。當您將物件調暗時,即是在增加不透明度。您可以透過增加或減少數值來調整背景圖片的不透明度。

若要變更背景圖片的不透明度:

  1. 前往編輯器中的相關頁面。
  2. 點擊編輯器左側的網站設計
  3. 點擊頁面背景
  4. 選擇您要執行的操作:
    • 預設圖片:從可用選項中選擇預設圖片
    • 上傳自有圖片:按照步驟上傳新圖片。
      • 點擊圖片
      • 點擊上傳媒體
      • 使用偏好的方式上傳圖片。
      • 點擊變更背景
  5. 點擊背景圖片預覽上的設定
    請留意:「設定」僅在已選擇或上傳圖片時才會顯現。
頁面背景設定螢幕截圖,滑鼠浮動於設定、顏色、圖片和影片背景選項上
  1. 拖曳 圖片不透明度 (%) 滑桿,即可調整圖片的顯示程度。
  2. (選填)點擊 圖片後方色彩 色彩方塊並選擇色彩。

為背景圖片新增捲動效果

為圖片新增捲動效果以增添風格。您可以選擇新增視差捲動或凍結效果。這些效果是什麼?
視差捲動允許前景和背景移動,但背景移動速度較慢,提供深度錯覺。新增凍結捲動則表示當訪客上下捲動時,頁面背景不會移動,但上方的內容會移動。

若要新增捲動效果:

  1. 前往編輯器中的相關頁面。
  2. 點擊編輯器左側的網站設計
  3. 點擊頁面背景
  4. 點擊設定
  5. 選擇捲動效果:
    • :無捲動效果。
    • 視差:頁面背景與上方內容以不同速度移動,為訪客營造酷炫有趣的體驗。
      請留意:視差捲動不會在網站的行動裝置版本中顯示。
    • 凍結:這表示當訪客上下捲動時,頁面背景不會移動,但上方的內容會移動。
背景圖片設定螢幕截圖,捲動效果列表顯示無、視差和凍結等強調選項

變更背景圖片縮放比例和位置

變更背景的縮放比例和位置,以適應不同的畫面尺寸。您可以選擇讓圖片背景填滿整個畫面,或維持特定的寬度和高度以符合畫面比例。

若要變更圖片縮放比例和位置:

  1. 新增圖片背景
  2. 點擊背景圖片,然後點擊變更背景
  3. 點擊設定
顯示變更圖片背景選項的螢幕截圖。
  1. 圖片如何縮放?下方選擇一個選項:
    • 填滿:背景圖片會調整大小以符合桌面畫面尺寸。至於行動裝置畫面,則會保持比例。
    • 圖塊:背景圖片會以圖塊排列方式顯示在畫面上。
  2. 位置在哪裡?下方,於格線上選擇一個位置。
正在尋找更多設計靈感嗎?
Wix 設計中心是獲取想法和 網站設計 趨勢的絕佳資源。