什么是 WordPress 和网页设计中的页边距？

页边距是添加在网页或网页内其他元素周围的空间。可以将典型的网页想象成一张空白的纸，页边距就是纸张边缘周围的白色或空白区域。

使用页边距的目的是确保网页内的元素看起来不过于紧凑。同样，在页面布局内的不同元素周围也可以使用页边距。例如，你可以更改图像周围的页边距，使它们与文本的距离不太近，或者添加页边距以在内容区域和侧边栏之间留出空间。

页边距和填充的区别是什么？

页边距和填充都用于在网页设计中增加空白空间，但它们的使用方式非常不同。页边距在元素外添加空白空间，而填充在元素内添加空白空间。

页边距用于在元素外增加空间，它们可以确保网页上的元素之间有足够的空间。

示例：

1. 为文章中的图像和文本之间增加页边距。

2. 调整页边距以增加标题和内容区域之间的空间。

填充则用于在内容和框或元素的边缘之间增加缓冲空间。

示例：

1. 调整填充以增加行动呼吁按钮中的缓冲空间。

2. 增加文本栏中的填充。

无论是填充还是页边距，在网页设计中都被广泛使用。使用空白空间为任何设计增加了呼吸空间，使其更加用户友好和优雅。

为什么需要在 WordPress 中添加或更改页边距？

页边距是网页设计的重要组成部分，它们能使你的网站看起来更舒适和便于用户使用。WordPress 主题在处理你的网站设计方面做得很好，大多数已经通过设置 CSS 规则在主题布局中使用了大量的白色空间。

如何在 WordPress 中添加页边距？

在 WordPress 中有多种方法可以添加页边距，选择适合你的方法取决于你希望添加页边距的位置和主题提供的选项。我们从 WordPress 自带的默认选项开始，因为对于初学者来说，这些选项是最简单的。

使用完整站点编辑器在 WordPress 中添加页边距

如果你使用的是支持完整站点编辑器的基于区块的主题，那么你可以使用内置站点编辑器在 WordPress 网站的任何地方更改页边距。首先，你需要访问外观（Appearance）» 编辑器以启动站点编辑器。

进入站点编辑器后，从左侧列中选择一个模板或在预览窗口中的任何地方点击。接下来，点击你希望更改页边距的区域或元素。在右侧列中，你将看到在“样式（Style）”选项卡下的页边距调整选项。

在区块编辑器中添加页边距

如果你在处理博客文章或页面，你将使用区块编辑器。WordPress 的区块编辑器允许你为不同的区块添加和更改页边距。只需点击你希望添加或调整页边距的区块，在区块设置下切换到“样式（Style）”选项卡并向下滚动到“尺寸（Dimensions）”或“页边距（Margins）”选项。

使用 SeedProd 在 WordPress 中添加页边距

SeedProd 是市场上最好的 WordPress 页面构建器插件，它可以轻松创建自定义页面，甚至可以从头开始创建自定义的 WordPress 主题。SeedProd 的直观拖放页面构建器让你可以轻松调整编辑器中任何元素的页边距。

使用 Thrive Architect 更改页边距

Thrive Architect 是最佳的 WordPress 页面构建工具之一，它允许你使用拖放界面设计 WordPress 页面。它还带有超过 300 个模板可供使用。通过使用右侧工具栏的布局选项，你可以更改元素的页边距和填充。

使用 CSS 代码在 WordPress 中更改页边距

此方法需要你在 WordPress 主题中添加 CSS 代码，并且你需要对 HTML 和 CSS 有基本了解。然而，这种方法提供了更多的灵活性，你可以手动选择需要添加或调整页边距的区域。

使用自定义 CSS 在站点编辑器中更改页边距

如果你使用的是支持完整站点编辑器的区块主题，则可以在站点编辑器中添加自定义 CSS 代码。访问“外观（Appearance）» 编辑器”页面，切换到样式面板，并在底部点击“附加 CSS”选项卡。

在主题定制器中添加页边距

如果你使用的是经典主题（不支持站点编辑器），则可以在主题定制器中保存自定义 CSS 代码。

使用 WPCode 插件添加自定义 CSS 代码

使用 WPCode 插件是添加自定义 CSS 代码到 WordPress 中的最简单方法。它是最好的 WordPress 代码片段插件，允许你添加任何 CSS/HTML/PHP/JavaScript 代码而不会破坏网站。

我们希望这篇文章帮助你了解如何在 WordPress 中添加或更改页边距。你也可以查看我们的完整 WordPress 主题开发备忘单或了解我们的 WordPress 主题定制指南。