Background 背景

背景

設定元素的背景讓您控制外觀和可讀性。在樣式面板的 "背景"部分，您可以為大多數元素添加背景圖像、漸變或顏色（視頻和圖像等媒體元素除外）。

1. 背景顏色

2. 背景圖片

3. 漸層

4. 顏色疊加

5. 背景視頻

背景顏色

透過輸入顏色值（十六進制＼rgba＼顏色名稱）或使用取色器選擇顏色，您可以在任何元素上設置一個背景顏色，除了圖像和視頻。

一旦設置了Body (All pages)的背景，您添加的任何元素都會默認為這個背景樣式。而且不僅可以對背景顏色進行修改，還可以對任何樣式屬性進行修改。

您可以用2種方式為Body (All pages)標簽設置樣式。

1. 選擇Body元素，從樣式面板的選擇器字段下拉選擇Body (All pages)標簽

2. 選擇任何元素，從繼承菜單中選擇Body (All pages)標簽--所有元素都繼承Body (All pages)標簽的樣式。

大多數元素默認透明背景。有些元素有默認的背景顏色，則可以透過元素上設置的背景顏色來覆蓋。

背景圖片

在風格面板的背景部分，添加背景圖片的菜單。

1. 滾動到樣式面板中的背景

2. 點擊選擇圖像，從資產面板中選擇一個圖像。

3. 勾選@2x（將圖像寬度設置為其原始尺寸的一半，以便在HiDPI設備上清晰地呈現出來）。

背景圖像大小

在樣式面板的背景部分添加背景圖像的菜單中，尺寸選項被突出顯示。 要指定背景圖像的大小，可以使用自定義尺寸或預設之一。

1. 自定義：決定了背景圖像的寬度和高度，可以使用百分比值。設置背景圖像的比例大於元素，使用高於100%的任何百分比。

2. Cover：將圖像縮放以填充並覆蓋整個元素的背景，覆蓋任何設定的寬度和高度。圖像可能會被修剪，這取決於元素的長寬比、屏幕尺寸和圖像的情況。

3. Contain：縮放背景圖像，使其包含在元素內。這個值也覆蓋了任何設定的寬度和高度。

重複

默認情況下，背景圖像在垂直和水平方向上都會重復。 您可以選擇水平、垂直或完全不重複背景。

您可以在背景設置中選擇滾動時背景圖像的行為。

不固定：圖像隨著頁面的滾動而滾動 固定：圖像在滾動時保持原位

漸層

漸層可以單獨使用，也可以在現有的背景顏色或圖像上使用。

1. 線性漸變

2. 徑向漸變

顏色疊加

您可以在任何背景上添加一個顏色覆蓋。使用顏色選擇器來選擇顏色，然後設定不透明度值。

添加和堆疊多個背景圖像、梯度和顏色覆蓋，以創建分層效果。要重新排列背景圖層，把鼠標懸停在圖層上，點擊左邊的虛線垂直線。

點擊眼睛圖標來切換圖層的可見性。要刪除任何層，點擊垃圾桶的 "刪除 "圖標。

背景視頻

背景視頻是無聲的、循環的視頻，作為內容的特定部分的背景。這些視頻有助於吸引網站訪問者和抓住注意力。

把背景視頻放到畫布上時，您會被提示上傳視頻。

視頻設置

背景視頻有三個默認的設置。循環視頻，自動播放視頻，以及播放/暫停按鈕。

1. 循環視頻 啟用時，背景視頻會連續循環播放。

2. 自動播放視頻 啟用時，背景視頻在頁面加載時就開始播放。

3. 播放/暫停按鈕 在背景視頻上提供一個內置的播放/暫停按鈕，您的網站訪問者可以用它來開始和停止視頻。

支持的視頻格式

背景視頻接受小於30MB的視頻文件，格式如下：webm, mp4, mov, ogg。

背景視頻文件名不應包括空格或特殊字符（破折號除外），視頻應針對網絡進行優化以獲得最佳性能。

替換背景視頻

1. 雙擊視頻或進入設置面板來打開背景視頻設置。

2. 通過選擇元素並按回車鍵來訪問背景視頻設置。壹旦設置窗口打開，點擊替換視頻來上傳和轉碼壹個新視頻。