选择器

块选择器是允许块自定义使用的CSS选择器的API
当它们的样式生成时。

块可以在三个级别自定义其CSS选择器：根、功能和
子功能。

根选择器

根选择器是块的主要CSS选择器。

所有块都需要一个主CSS选择器，以便其样式声明
包含在下。如果不是通过块选择器API提供
默认值以以下形式生成.wp-块-<名称>.

例子

{...“选择器”：{“root”：“.my-custom-block-selector”}}

功能选择器

特征选择器与块支持的样式相关，例如边框、颜色、，
排版等。

块可能希望将特定特征的样式应用于不同的
块中的元素。例如，在块的包装上使用颜色
但只将字体样式应用于内部标题。

例子

{...“选择器”：{“root”：“.my-custom-block-selector”，“color”：“.my-custom-block-selector”，“排版”：“.my自定义块选择器>h2”}}

子特征选择器

这些选择器与块支持提供的单个样式相关，例如。
背景颜色

子功能可以在其自己的唯一选择器下生成样式。这是
当一个块支持子功能不能应用于
与支持的其他子功能相同的元素。

一个很好的例子是文本删除.Web浏览器呈现此样式
不同的是，如果添加到包装器元素，则很难覆盖。由
指派文本删除自定义选择器，其样式只能针对
它应该应用到的元素。

例子

{...“选择器”：{“root”：“.my-custom-block-selector”，“color”：“.my-custom-block-selector”，“排版”：{“root”：“.my-custom-block-selector>h2”，“text-decoration”：“.my-custom-block-selector>h2-span”}}}

速记

您可以设置单个CSS选择器，而不是为每个子功能指定CSS选择器
选择器作为相关功能的字符串值。这就是方法
为演示颜色前面示例中的特性。

后备人员

尚未为特定功能配置的选择器将回退到
块的根选择器。类似地，如果子功能没有自定义
选择器集，它将回退到其父特征的选择器，如果不可用，则进一步回退到块的根选择器。

您可以设置
作为父要素的公共选择器根选择器并仅定义
不同子功能的唯一选择器。

例子

{...“选择器”：{“root”：“.my-custom-block-selector”，“颜色”：{“文本”：“.my-custom-block-selector p”},“排版”：{“root”：“.my-custom-block-selector>h2”，“text decoration”：“.my自定义块选择器>h2 span”}}}

这个颜色.背景色上面没有明确设置子功能
例子。作为颜色功能也没有定义根选择器，
颜色.背景色将包含在块的主根下
选择器，.my-custom-block选择器.

对于子功能，例如字体.font-size，它将回退到其父级
给定存在的功能选择器，即。.my-custom-block-selector>h2.