创建 USS 变量

您可以创建一个 USS 变量并在其他 USS 属性中使用它。更新 USS 变量时，使用该变量的所有 USS 属性都会更新。还可以为 USS 变量指定默认值。

创建和使用 USS 变量

要创建 USS 变量，请在其名称前加上双连字符（--）。

--color-1: red;

要在另一个 USS 规则中使用 USS 变量值，请使用 var() 函数来调用它。

var(--color-1);

当您更新变量时，它会更新所有使用它的 USS 属性。

例如，以下 USS 代码片段定义了一个声明两个颜色变量的样式规则，以及两个使用这些变量的样式规则。

:root {
  --color-1: blue;
  --color-2: yellow;
}

.paragraph-regular {
  color: var(--color-1);
  background: var(--color-2);
  padding: 2px;
  }

.paragraph-reverse {
  color: var(--color-2);
  background: var(--color-1);
  padding: 2px;
  }

要更新颜色方案，您可以更改两个变量值而不是四个颜色值。

使用变量可以更轻松地管理复杂__ UI__（即用户界面，User Interface）让用户能够与您的应用程序进行交互。Unity 目前支持三种 UI 系统。更多信息
See in Glossary 的样式，其中多个规则（有时在不同的样式表中）使用相同的值。

指定 USS 变量的默认值

var() 函数接受一个可选的默认值。UI 系统在无法解析变量时使用默认值。例如，如果您从样式表中删除一个变量，但忘记删除对它的引用。

要为变量指定默认值，请将其添加在变量值之后，并以逗号 , 分隔。

以下 USS 代码片段调用 --color-1 变量。如果 UI 系统无法解析变量，则会使用十六进制值表示红色 (#FF0000)。

var(--color-1, #FF0000);

与 CSS变量的区别

变量在 USS 中的工作方式与在 CSS 中的工作方式几乎相同。有关 CSS 变量的详细信息，请参阅 MDN 文档。但是，USS 不支持 CSS 的某些功能：

USS 不支持其他函数中的 var() 函数，如下所示：

  background-color: rgb(var(--red), 0, 0);

USS 不支持对变量进行数学运算。

其他资源

USS 自定义属性（变量）

USS 内置变量简介