版本:Unity 6 (6000.0)
语言:英语
后代选择器
多个选择器

子选择器

USS 子选择器匹配在视觉树一个由轻量级节点组成的对象图,它包含窗口或面板中的所有元素。它定义了使用 UI 工具包构建的每个 UI。
参见 术语表
中作为另一个元素子级的元素。

语法

子选择器由多个用 > 分隔的简单选择器组成。

selector1 > selector2 {...}

您可以在复杂选择器中包含通配符选择器。例如,以下 USS 规则在子选择器中使用通配符选择器。此 USS 规则匹配作为分配了 USS 类 yellow 的元素子级的元素的子级的按钮。

.yellow > * > Button{..}

示例

为了演示简单选择器如何匹配元素,这里有一个示例UI(用户界面) 允许用户与您的应用程序交互。Unity 目前支持三种 UI 系统。 更多信息
参见 术语表
文档。

<UXML xmlns="UnityEngine.UIElements">
  <VisualElement name="container1">
    <VisualElement name="container2" class="yellow">
      <Button name="OK" class="yellow" text="OK" />
      <Button name="Cancel" text="Cancel" />
    </VisualElement>
  </VisualElement>
</UXML>

没有应用任何样式时,UI 看起来像下面这样

Example buttons with margins and thin blue borders.
带有边距和细蓝色边框的示例按钮。

以下子选择器样式规则只匹配内部元素。具有 .yellow 类的元素 #OK 是元素 #container2 的子级。#container2 是元素 #container1 的子级。但是,由于 #OK 不是 #container1 的直接后代,因此当使用来自 #container1 的子选择器应用时,它与 .yellow 选择器不匹配。

#container1 > .yellow {
  background-color: yellow;
}

当您应用样式时,UI 看起来像下面这样

The container2 has a yellow background color.
container2 具有黄色的背景颜色。

其他资源

后代选择器
多个选择器