Version: 2022.1
言語: 日本語
Style UI
USS セレクター

Introduction to USS

A Unity Style Sheet (USS) is a text file recognized as an asset that supports style rules. The USS text file must have the .uss extension.

A USS consists of the following:

  • Style rules that include a selector and a declaration block.
  • Selectors that identify which visual element the style rule affects.
  • A declaration block, inside curly braces, that has one or more style declarations. Each style declaration has a property and a value. Each style declaration ends with a semi-colon.

構文

The following is the general syntax of a style rule:

selector {
  property1: value;
  property2: value;
}

ルールに一致するスタイル

When you define a style sheet, you can apply it to a visual tree. Selectors match against elements to resolve which properties apply from the USS file. If a selector matches an element, the style declarations apply to the element.

例えば、以下のルールはすべての Button オブジェクトに適合します。

Button {
  width: 200px;
}

対応するセレクターのタイプ

USS supports several types of simple and complex selectors that match elements based on different criteria, such as the following:

  • Element C# type name
  • 割り当てられた name プロパティ
  • USS クラスのリスト
  • The element’s position in the visual tree and its relationship to other elements

USS also supports pseudo classes that you can use with selectors to target elements that are in a specific state or select the :root element.

If an element matches more than one selector, USS applies the styles from whichever selector takes precedence.

単純セレクター

USS supports a set of simple selectors that are analogous, but not identical, to simple selectors in CSS. The following table provides a quick reference of USS simple selectors.

Selector type Syntax Matches
Type selector Type {...} Elements of a specific C# or visual element type.
Class selector .class {...} Elements with an assigned USS class.
Name selector #name {..} Elements with an assigned name attribute.
Universal selector * {...} Any elements.

複合セレクター

USS supports a subset of CSS complex selectors. The following table provides a quick reference of USS complex selectors.

Selector type Syntax Matches
Descendant selector selector1 selector2 {...} Elements that are the descendant of another element in the visual tree.
Child selector selector1 > selector2 {...} Elements that are the children of another element in the visual tree.
Multiple selector selector1selector2 {...} Elements that match all the simple selectors.

その他の参考資料

Style UI
USS セレクター
Copyright © 2023 Unity Technologies
优美缔软件(上海)有限公司 版权所有
"Unity"、Unity 徽标及其他 Unity 商标是 Unity Technologies 或其附属机构在美国及其他地区的商标或注册商标。其他名称或品牌是其各自所有者的商标。
公安部备案号:
31010902002961