Селекторы классов
Селекторы USS-классов подбирают элементы, которым назначены определённые USS-классы. Они аналогичны селекторам классов в CSS.
Синтаксис
Селектор класса состоит из имени класса с точкой в начале. Имена классов чувствительны к регистру и не могут начинаться с цифры.
.className { ... }
Точка ставится только тогда, когда вы пишете селектор в файле USS. Не включайте её, назначая класс элементу в файле UXML или C#. Например, не пишите <Button class=".yellow" />.
В целом не используйте точку в именах классов: парсер USS в Unity воспринимает точку как начало нового класса. Например, если вы создадите класс с именем yellow.button, и создать следующее правило USS: .yellow.button{...}. Парсер интерпретирует селектор как многократный селектор, и пытается найти элементы, которые соответствуют как .yellow класс и .button class.
Если элементу назначено несколько классов, селектору достаточно совпасть лишь с одним из них, чтобы подойти элементу.
Вы также можете указать несколько классов в селекторе, в этом случае элемент должен иметь назначенные все эти классы, чтобы соответствовать. Подробнее см. Несколько селекторов.
Пример
Чтобы продемонстрировать, как простые селекторы соответствуют элементам, вот пример Документа 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 выглядит следующим образом:
Следующее стилевое правило с селектором класса по имени соответствует элементу container2 и элемент кнопки OK, и изменяет их фон на желтый.
.yellow {
background-color: yellow;
}
При применении стиля UI выглядит следующим образом:
