UI Toolkit では、USS を使用してビジュアル要素の見た目をカスタマイズできます。USS の推奨ワークフローは、UI Builder で視覚的に要素のスタイル設定を行い、そのスタイルを USS ファイルに抽出して UXML で参照することです。
UI Builder で要素にスタイルを設定すると、そのスタイルが UXML 要素の style 属性にインラインスタイルとして追加されます (以下参照)。
<ui:UXML ...>
<ui:VisualElement style="width: 200px; height: 200px; background-color: red;" />
</ui:UXML>
スタイルシートファイルを参照するには、UXML ファイルのルート要素の下に <Style> 要素を追加します。
例えば、UXML ファイルと同じフォルダーに styles.uss という USS ファイルがあり、以下の内容になっているとします。
# root {
width: 200px;
height: 200px;
background-color: red;
}
これは以下のように参照できます。
<ui:UXML ...>
<Style src="styles.uss" />
<ui:VisualElement name="root" />
</ui:UXML>