使用指南/样式/边框和阴影设置

边框和阴影设置

WordPress 编辑器中的许多区块都包含边框设置,您可以使用这些设置在您的内容周围添加边框线。本指南将向您介绍如何使用这些边框设置。

查看边框和阴影设置

边框和阴影设置可以应用于整个站点、站点上的特定元素或单个内容区块。系统只会为支持边框的区块显示应用边框和阴影的选项。

要编辑整个站点的样式设置,请按照以下步骤操作:

  1. 访问您站点的仪表盘
  2. 转到“外观 → 编辑器”。
  3. 选择左侧菜单中的“样式”。

了解关于编辑站点样式的更多信息。

要更改单个区块的样式设置,请按照以下步骤操作:

  1. 访问您站点的仪表盘
  2. 导航至您要编辑的页面文章模板
  3. 选择要应用样式的区块。
  4. 找到区块设置边栏

在大多数情况下,样式设置位于主区块设置边栏中。有时,您会看到一个单独的样式选项卡,显示为一个黑白圆圈。

区块设置边栏,箭头指向“样式”选项。
箭头从“区块设置”中的“样式”图标指向“边框和阴影”部分。
“图片”区块中的边框和阴影设置示例

查看所有设置

使用以下设置调整区块文本的外观。

如果您未看到这些设置,请点击“边框和阴影”右侧的三个点(如右图所示)。然后,您可以选择要访问的选项:

  • 边框
  • 半径
  • 阴影
箭头从“边框和阴影”省略号菜单指向“边框和阴影”设置。

添加边框

边框”设置可为区块添加外围轮廓线。您可以选择边框的厚度、颜色和半径。

要为区块添加边框,请执行以下步骤:

  1. 选择区块,然后打开“区块设置”边栏。
  2. 找到边栏中的“边框和阴影”部分。
  3. 输入精确数值或拖动滑块来绘制边框。
  4. 可选:您可以通过点击尺寸字段左侧的圆圈来更改边框颜色。选择主题颜色、默认颜色,或使用颜色选择器自行设置。

默认情况下,边框的数值以像素为单位。点击字段旁边的“px”可更改为其他单位(%、em、rem、vw 和 vh)。进一步了解不同的尺寸设置单位

Video showing how to add a border to an image block.

调整边框半径

半径”设置可为区块边框添加圆角效果。将边框半径设为 0 可使区块保持直角,而设为 100 则呈现圆角效果,如下所示:

带有圆角边框的“图片”区块。
带有圆角边框的“图片”区块

高级边框设置

您可以通过边框半径设置实现创意效果。通过使用“取消边线联动”选项,您可分别设置区块各边的边框和半径。

“取消边线联动”图标被框出,显示提示文本“取消边线联动”。

要为各边分别设置自定义边框或半径,请执行以下步骤:

  1. 点击“边框”或“半径”右侧的“取消边线联动”图标。
  2. 为各边设置自定义尺寸。

您还可以点击“边框颜色和样式选择器”,为边框设置不同的颜色和样式。

边框和半径设置
自定义边框与半径实现独特效果的示例。

添加阴影

阴影”选项可为区块添加投影效果,但仅适用于某些区块(包括“按钮”、“图片”和“栏目”区块)。

“阴影”部分展开,箭头指向不同的投影选项。
“按钮”区块中的按钮应用投影的示例。

请为您的元素选择以下阴影效果之一:

  • 自然
  • 深邃
  • 锐利
  • 轮廓
  • 清晰

自定义阴影设置

您可以自定义默认阴影效果,也可以通过样式编辑器自行创建。

  1. 访问您站点的仪表盘
  2. 转到“外观 → 编辑器”。
  3. 选择左侧菜单中的“样式”。
    • 在编辑器中,您还可以选择右上角的样式图标,按钮看起来像一个黑白圆圈。
  4. 点击“阴影”选项。
  5. 点击您要自定义的阴影的名称。要创建新的自定义阴影,请点击“自定义”标题旁边的加号图标,然后点击新自定义阴影的名称。
  6. 在阴影设置中,您可以看到阴影效果的预览,以及下方的阴影名称。点击阴影名称即可调整以下设置:
    • 颜色:使用颜色选择器选择阴影颜色。
    • 外阴影或内阴影:选择阴影显示在元素外部还是内部。
    • X 轴位置和 Y 轴位置:调整阴影相对于对象的偏移距离。
    • 模糊度:调整阴影的虚化程度。
    • 扩散度:调整阴影的显示大小范围。
  7. 完成设置后,点击“保存”按钮,保存您的更改。

重置边框和阴影

您可以重置对区块边框和阴影所做的自定义设置,然后重新开始。要重置样式,请执行以下步骤:

  1. 点击“边框和阴影”选项(版块标题右侧的三个竖点图标)。
  2. 取消勾选单项设置以重置特定设置,或点击“全部重置”以重置所有设置。

如果未显示重置选项,则表示当前无自定义设置可清除。

箭头从边框设置图标指向单项设置和“全部重置”选项周围的方框。
Copied to clipboard!