您可能已经知道 CSS 自定义属性在开发主题时可以如何帮助您。即便如此，仍有许多好处值得注意。
我们已经讨论了模块化和可重用性。您定义为自定义属性的所有通用值将提高一致性并减少冗余。冗余将转化为您的主题更好的潜在性能。
对于最终用户来说，自定义属性有几个优点：
简化自定义。用户和网站所有者无需复杂的 CSS 知识即可自定义主题。通过 公开变量后，用户可以通过网站编辑器访问设置。
与 FSE 的兼容性更好。自定义属性符合 FSE 原则，可让您创建更灵活、更动态的主题设计。
维护和更新更轻松。如果您需要更新主题中的通用值，自定义属性意味着只需在一个地方进行更改。它简化了您的维护工作，使更新和调整更易于管理。
总体而言，自定义属性可以改善主题开发工作流程。确定它们也比使用典型的 CSS 变量更直接。
如何在 中定义 CSS 自定义属性
让我们深入了解在 中定义和使用 CSS 自定义属性的实际方面。第一步是学习如何编写它们。
语法和命名约定
WordPress 提供了custom属性来帮助定义。这比@伪类中 丹麦 WhatsApp 号码数据 的属性或定义稍微容易一些，并且使用标准的键/值格式：
在后台，WordPress 将处理此定义并使用双连字符生成 CSS 自定义属性：
--wp--custom--始终是 CSS 属性的一部分，并且不会使用驼峰式大小写。例如，如果您将其定义lineHeight为自定义属性，WordPress 会将其转换为“短横线大小写：”
在命名约定方面，您可以根据需要使用驼峰式命名法，但我们建议您使用短横线命名法来命名自定义属性名称。这符合 WordPress 的命名约定，提高了可读性，并减少了处理错误。
注意：CSS 自定义属性使用双连字符，因为W3C 的 CSS 工作组也鼓励您使用 Sass（使用美元符号来定义属性）。这样，您就可以同时使用这两种方式来增强您的设计。
WordPress 已经定义了一些自定义属性 — 或者至少主题有这个选项。这意味着您将看到其中没有明确声明的 CSS 变量：
在此示例中，我们使用现有的预设颜色定义主色。然后，我们定义一些自定义间距属性，然后使用 设置它们var()。
这意味着我们不需要将值硬编码到 中。此外，用户可以在站点编辑器中更新这些值并让它们在整个主题中传播。
预设与自定义属性
当然，还允许您定义颜色、字体大小和其他常见主题元素的预设。另一方面，您可以对要在整个主题中重复使用的任何值使用自定义属性。
这里最大的区别在于命名约定和可访问性。用户将无法在站点编辑器中访问自定义属性，除非您进行进一步的操作。使用预设，WordPress 将生成类似于处理自定义属性的 CSS：
请注意，即使将驼峰式命名转换为短横线命名后，进一步的属性嵌套仍将使用双连字符。
全局和块特定的 CSS 与 CSS 自定义属性
使用经典 WordPress，您可以在前端使用附加和自定义 CSS来设计主题中的元素。FSE 也是如此，尽管方法与 CSS 自定义属性不同。
如果您访问站点编辑器并进入样式屏幕，您会看到“附加 CSS”部分。它的作用类似于经典 WordPress 安装中的自定义 CSS 面板：
WordPress 网站编辑器的部分视图，显示指向“块”和“附加 CSS”设置的链接。屏幕左侧显示蓝天背景下建筑物的部分视图。
WordPress 网站编辑器中的附加 CSS 部分。
这代表了一种向主题添加全局 CSS 自定义的方法。但是，这实际上是一种让用户能够添加 CSS 的方法。您还可以使用它来进行不需要整个样式表的细微更改。
候在 中设置这样的 CSS ，您都会在任何站点编辑器附加 CSS字段中看到它。但是，请记住，您声明使用的任何内容都不是 CSS 自定义属性。css
使用与号 (&) 选择器
与 Sass 非常相似，WordPress 也支持 & 选择器，但有一些不同。在这种情况下，它是定位嵌套元素和属性的好方法。如果您选择为单个块声明 CSS 自定义属性，这可能会很有用。
例如，请看以下内容：
如果您希望扩展目标 CSS，那么 & 选择器是极好的选择器。理解选择器的一个好方法是，它有助于分离 CSS 元素。以下面的例子为例：
{