Padding 與 Margin 在 WordPress 中有什麼區別?

WPressize Me

01/03/2024

什麼是 WordPress 中的 Padding?

Padding 功能用於在您的 WordPress 網站中創建區塊內部的空間。例如,您可以在文本區塊內添加空間,使佈局更具視覺吸引力,並防止文本顯得太接近區塊邊界。您還可以使用 Padding 控制內容在您的 WordPress 博客上的流動。如果您在文本區塊的頂部和底部添加 Padding,則可以使訪問者更容易閱讀內容。

什麼是 WordPress 中的 Margin?

Margin 是區塊邊界和其周圍元素之間的空間,這可以幫助您在兩個不同的區塊之間添加空間,從而為您網站創建一個更寬敞和整潔的佈局。例如,您可以在文本區塊的頂部和底部添加 Margin,以便即使在調整屏幕大小時該區塊依然可見。此外,您還可以使用 Margin 在圖像區塊和文本區塊之間添加空間,讓您的網站在視覺上更具吸引力和更易於訪問者使用。

Padding 和 Margin 在 WordPress 中的區別是什麼?

以下是 Padding 和 Margin 在 WordPress 中的主要區別:
Padding: 在區塊的內容和邊界之間添加空間。
Margin: 在區塊的邊界外部添加空間。
使用 Padding 不會影響網站上的其他區塊。
使用 Margin 會影響您的網站上的其他區塊。
Padding 可以在區塊周圍創造緩衝。
Margin 可以在兩個不同的區塊之間創造空間。

如何在 WordPress 中使用 Padding

默認情況下,WordPress 的完全站點編輯器(FSE)帶有 Padding 功能。然而,請記住,如果您沒有使用基於區塊的主題,則無法在您的 WordPress 站點上添加 Padding,除非您使用自定義 CSS。首先,您需要從 WordPress 管理員側邊欄訪問 外觀 » 編輯器 頁面以啟動完全站點編輯器。進入後,只需從左側的“模板”側邊欄選擇您想要向其區塊添加 Padding 的頁面模板。這個側邊欄將顯示您的網站上不同頁面的所有模板。選擇模板後,該模板將在屏幕上打開。從這裡,點擊“編輯”按鈕以開始在完全站點編輯器中自定義您的頁面模板。接下來,選擇您想要添加 Padding 的區塊。記住這意味著您將在內容和區塊的邊界之間創建空間。這將打開區塊右側面板中的區塊設置。從這裡,您需要捲動到“尺寸”部分,然後點擊三點菜單。這將打開一個提示,您必須在其中選擇“Padding”選項。接下來,只需使用這兩個滑塊為您的區塊添加水平和垂直的 Padding。請記住,這些滑塊會向區塊的所有邊添加 Padding。然而,如果您只想在區塊的頂部、底部、左側或右側添加 Padding,那麼您也可以通過點擊 Padding 部分中的“Padding 選項”圖標來做到這一點。這將打開一個提示,您可以從中選擇要向其添加 Padding 的區塊的不同側面。請記住,如果您想在區塊的多個側面添加不同的 Padding,那麼您必須選擇“自定義”選項。這將在屏幕上添加四個不同的滑塊,以向區塊的右側、左側、底部或頂部添加 Padding。完成後,請點擊“保存”按鈕以存儲您的設置。

如何在 WordPress 中使用 Margin

和 Padding 一樣,WordPress 的完全站點編輯器中內建了 Margin 功能。然而,如果您未使用區塊主題,則無法使用此功能。首先,從 WordPress 儀表板進入 外觀 » 編輯器 頁面。進入後,從左側列選擇您要向其添加 Margin 的頁面模板。這將打開您選擇的頁面模板。從這裡,只需選擇“編輯”按鈕以在完全站點編輯器中開始自定義您的模板。接下來,選擇您要自定義的區塊,然後滾動到右側區塊面板中的“尺寸”部分。從這裡,只需使用兩個滑塊為頂部、底部、左側和右側的角落設置水平和垂直 Margin。這一功能將會在您選擇的區塊周圍創建空間。然而,如果您想使用多個滑塊在區塊周圍添加不同的 Margin,則請點擊部分中的“Margin 選項”圖標。這將在屏幕上打開新提示,從這裡您可以選擇一個側面以添加 Margin。然而,如果您想在多個側面添加不同的 Margin,則可以選擇“自定義”選項。區塊面板現在將在屏幕上顯示各種滑塊,您可以使用它們來設置不同的 Margin。完成後,請勿忘點擊頂部的“保存”按鈕以存儲您的設置。

更多 WordPress 完全站點編輯的小技巧

除了向區塊添加 Padding 和 Margin,您還可以使用完全站點編輯器來自定義整個 WordPress 主題。例如,您可以設計所有頁面模板,添加自定義標誌,選擇品牌顏色,改變佈局,調整字體大小,添加背景圖片等等。您還可以添加模式和不同的區塊來進一步自定義您的網站。詳情請參見我們的初學者指南,了解如何自定義您的 WordPress 主題。您還可以使用完全站點編輯器向您的網站添加標題、導航菜單或自定義 CSS。此外,您還可以使用全局樣式來確保網站的一致性。詳細說明請參見我們的指南,了解如何自定義您的 WordPress 網站顏色。如果您不喜歡使用完全站點編輯器,並且希望更好地控制網站的外觀,則可以使用 SeedProd 來構建頁面,甚至是整個主題。它是市面上最好的登陸頁面構建器,並配有拖放構建器,使您能輕鬆創建一個驚人的網站主題。更多詳情請參見我們的教程,了解如何輕鬆創建自定義 WordPress 主題。

我們希望此文章能幫助您了解在 WordPress 中 Padding 和 Margin 之間的區別。您可能也會對我們的初學者指南感興趣,了解如何在 WordPress 中更改區塊的高度和寬度,以及了解我們為您挑選的最佳 Gutenberg 區塊插件。

如果您喜歡這篇文章,請訂閱我們的 YouTube 頻道,以獲取更多 WordPress 教程視頻。您也可以在 Twitter 和 Facebook 上找到我們。



Related Posts

  • 2024-07-28
  • WordPress 基础知识

WordPress主题定制器提供了出色的功能,使你无需触碰代码即可创建一个视觉上吸引人的站点。然而,导航各种自定义选项有时可能让人觉得不知所措。在这篇文章中,我们将引导你了解默认面板,并教你如何像专业人士一样使用WordPress主题定制器。

到文章结尾,你将能够使你的网站看起来更加精致和专业。

閱讀更多
  • 2024-07-26
  • WordPress 基础知识

默认情况下,WordPress会在30天后自动删除垃圾箱中的内容。然而,有些用户可能希望更频繁或手动清空垃圾箱。在本文中,我们将向您展示如何限制或禁用WordPress自动清空垃圾箱。

閱讀更多
  • 2024-07-23
  • WordPress 基础知识

您是否想在WordPress博客文章中嵌入视频?视频可以为您的网站带来活力,并且是增加用户参与度的绝佳方式。WordPress使得从YouTube、Vimeo、Facebook、Twitter等视频托管网站嵌入视频变得非常简单。在这个初学者指南中,我们将向您展示如何在WordPress博客文章、页面和侧边栏小部件中轻松嵌入视频。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>