為 Divi 下載 6 個免費的重複背景圖案

讓您的網站格外關注細節，對您的整體網頁設計風格的影響比您想像的要大。 通常是幫助人們區分模板類型網站和定製網站的小細節。

有幾種方法可以實現更高的設計。 您可以做的一件事是為頁面上的任何設計元素使用微妙的背景重複模式。 這不僅可以幫助您減小背景圖像的大小，還可以幫助您填充空白背景而不會壓倒它們。

在這篇文章中，您將能夠下載 6 種基本但用途廣泛的背景圖案，您可以在使用 Divi 構建任何類型的網站時使用它們。 當您需要為網頁設計增添趣味時，這些圖案非常適合放在口袋後面。

預覽

讓我們來看看使用這些背景圖案可以在您的網站上獲得什麼樣的結果：

免費下載背景圖案

要了解免費的背景圖案，您首先需要使用下面的按鈕下載它。 要訪問下載，您需要使用下面的表格訂閱我們的 Divi Daily 電子郵件列表。 作為新訂戶，您將在每週一和周五收到更多的 Divi 善良和免費的 Divi 佈局包！ 如果您已經在列表中，只需在下面輸入您的電子郵件地址，然後單擊下載。 您不會被“重新訂閱”或收到額外的電子郵件。

下載文件

免費下載

加入 Divi 時事通訊，我們將通過電子郵件向您發送一份最終的 Divi 登陸頁面佈局包，以及大量其他令人驚嘆的免費 Divi 資源、提示和技巧。 跟隨，您很快就會成為 Divi 大師。 如果您已經訂閱，只需在下面輸入您的電子郵件地址，然後單擊下載即可訪問佈局包。

下載

您已成功訂閱。 請檢查您的電子郵件地址以確認您的訂閱並獲得免費的每週 Divi 佈局包！

方法

• 下載文件夾並解壓後，您會發現 5 個不同的文件夾
• 這些文件夾中的每一個都代表一個不同的維度集：1000×1000、500×500、100×100、50×50 和 25×25
• 儘管這些在技術上是相同的模式，但根據您決定使用的維度集，您網站上的最終結果會有所不同
• 我們將這些圖案與 Divi 的背景選項相結合，以創建背景重複效果
• 這不僅可以使您的背景圖像保持一致，還可以減少對高分辨率背景圖像的需求

這個怎麼運作

在您的頁面上選擇一個部分

您可以將這些背景圖案應用於頁面上的任何設計元素。 我們將通過添加作為部分背景來演示它。 但是，您可以隨意將這些相同的模式添加到其他設計元素中，例如行、列和模塊。 你的設計元素越小，你需要的圖案尺寸就越小，這取決於你想要的外觀和感覺如何。

選擇您喜歡的尺寸

圖案一：1000×1000

後台設置

要實現我們上面分享的結果，請繼續在下載的 1000×1000 文件夾中找到模式 #1。 然後，將其上傳到您的部分背景設置並使用以下設置：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：中心
• 背景圖像重複：重複

帶漸變疊加

想要使用漸變背景混合圖案嗎？ 你也可以這樣做。 在下面的示例中，我們使用了一種純色和一種半透明色，並結合將漸變放置在背景圖像上方來創建混合效果。

• 顏色 1：#E2E2E2
• 顏色 2：rgba(255,255,255,0.37)
• 漸變類型：線性
• 梯度方向：181度
• 起始位置：7%
• 結束位置：35%

圖案#1 ：500×500

後台設置

您還可以使用 Divi 的內置背景選項使圖案僅水平或垂直顯示。 對於上面的示例，我們使用了 500×500 尺寸的圖案 #1 圖像文件。 上傳後，結合以下背景設置：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：頂部中心
• 背景圖像重複：重複 X（水平）

圖案#2 ：500×500

後台設置

我們使用 500×500 文件夾中的第二個模式做了同樣的事情。

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：頂部中心
• 背景圖像重複：重複 X（水平）

圖案#3 ：100×100

後台設置

對於下一個示例，在 100×100 維度文件夾中找到圖案 #3 並將其與以下背景選項組合，使圖案佔據整個部分：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：中心
• 背景圖像重複：重複

圖案#4 ：50×50

後台設置

尺寸越小，模式頻率越高。 在 50×50 維度文件夾中找到背景 #4 並將其與以下背景設置組合：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：頂部中心
• 背景圖像重複：重複

圖案 #5 ：100×100

後台設置

當您使用具有以下背景設置的 100×100 尺寸集時，第五個圖案提供了令人驚嘆和微妙的設計：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：頂部中心
• 背景圖像重複：重複

圖案 #6 ：25×25

後台設置

最後但並非最不重要的一點是，在 25×25 尺寸文件夾中找到圖案 #6，並將其與以下背景設置一起上傳到您的部分背景：

• 背景圖片尺寸：實際尺寸
• 背景圖片位置：頂部中心
• 背景圖像重複：重複

對行、列和模塊背景也使用模式

我們上面處理的示例只是您擁有的幾個選項。 如果您對包含的不同維度進行試驗，您將為每個模式獲得不同的結果。 最重要的是，您還可以使用 Divi 的背景選項來創建各種結果。 您不僅限於將這些背景圖案用於部分。 您可以將這些用於 Divi 的 Visual Builder 中的每個設計元素。 圖案的大小需要與元素的大小相匹配。 使用行、列和模塊背景的圖案來創建個性化和獨特的設計。

預覽

現在處理了一些不同的最終結果，您可以使用背景圖案獲得，讓我們最後看看最終結果：

最後的想法

在網頁設計中，注意細節很重要。 有很多方法可以做到這一點，但在這篇文章中，我們專門處理了使用背景圖案來獲取使用 Divi 的設計元素的微妙背景。 我們為您提供了 6 種不同的圖案，您可以免費下載和使用。 對於每一種模式，我們還提供了不同的維度，一旦在頁面上使用，就會導致不同的結果。 如果您有任何問題或建議，請務必在下方評論區留言！