USS は以下の種類の複合セレクターに対応しています。
このページでは、シンプルセレクターの各タイプについて説明し、構文と例を示します。また、以下の UXML 構文を使って、複合セレクターがどのように一致する要素を見つけるかを説明します。
<UXML xmlns="UnityEngine.UIElements">
<VisualElement name="container1">
<VisualElement name="container2" class="yellow">
<Button name="OK" class="yellow" text="OK" />
<Button name="Cancel"class="" text="Cancel" />
</VisualElement>
</VisualElement>
</UXML>
スタイルが適用されていない場合、UXML 構文は以下のような UI を生成します。
ノート |
---|
画像の例では、個々の要素を識別しやすくするために、余白や薄い青の境界線を入れています。 |
子孫セレクターは、スペース文字で区切られた 2 つのシンプルセレクターで構成されています。これは、最初のセレクターのすべての子孫で、2 番目のセレクターにも一致するものが該当します。
構文
selector1 selector2 {...}
例
上記の UXML 構文例 に関して、以下のスタイル規則は、内側の要素と最初のボタンに一致します。
# container1 .yellow {
background-color: yellow;
}
ノート |
---|
子孫セレクターとユニバーサルセレクターの併用は避けてください。この組み合わせで使用すると、システムが多数の要素を繰り返しテストする場合があり、パフォーマンスに影響を与える可能性があります。 |
子セレクターは、右角括弧 (>) で区切られた 2 つのシンプルセレクターで構成されています。これは、最初のセレクターの直接の子孫で、2 番目のセレクターにも一致するものが該当します。
構文
selector1 > selector2 {...}
例
上記の UXML 構文例 に関して、以下のスタイル規則は、内側の要素のみに一致します。
# container1 > .yellow {
background-color: yellow;
}
複数セレクターは、2 つ以上のシンプルセレクターで、区切りなしで構成されています。このセレクターは、これらのシンプルセレクターに一致するすべての要素に一致します。
構文
selector1selector2 {...}
例
上記の UXML 構文例 に関して、以下のスタイル規則は、最初の ボタンに一致します。
Button.yellow {
background-color: yellow;
}
UI システムで、複数のセレクターの組み合わせを解析できないことがあります。複数のセレクターが期待通りに動作するためには、USS パーサーが組み合わせを構成する各セレクターを区別できなければなりません。
例えば、以下の USS 規則は 2 つの C# クラスセレクター ListView
と Button
を組み合わせています。
ListViewButton{...}
USS パーサーは 2 つの C# クラスを分離できないため、ListViewButton という 1 つのクラスとして解釈してしまい、望ましい結果が得られません。
USS クラスセレクター と Name セレクター を複数セレクターで自由に組み合わせることができます。それぞれピリオド (.) と数字記号 (#) が前に付いているので、パーサーはそれらを明確に識別することができます。C# のクラスセレクターには識別文字がありません。そのため、複数のセレクターの中で使用できるのは 1 つだけで、組み合わせの中では、以下のように最初のセレクターにしなくてはなりません
ListView.yellow#vertical-list{...}
Did you find this page useful? Please give it a rating:
Thanks for rating this page!
What kind of problem would you like to report?
Thanks for letting us know! This page has been marked for review based on your feedback.
If you have time, you can provide more information to help us fix the problem faster.
Provide more information
You've told us this page needs code samples. If you'd like to help us further, you could provide a code sample, or tell us about what kind of code sample you'd like to see:
You've told us there are code samples on this page which don't work. If you know how to fix it, or have something better we could use instead, please let us know:
You've told us there is information missing from this page. Please tell us more about what's missing:
You've told us there is incorrect information on this page. If you know what we should change to make it correct, please tell us:
You've told us this page has unclear or confusing information. Please tell us more about what you found unclear or confusing, or let us know how we could make it clearer:
You've told us there is a spelling or grammar error on this page. Please tell us what's wrong:
You've told us this page has a problem. Please tell us more about what's wrong:
Thank you for helping to make the Unity documentation better!
Your feedback has been submitted as a ticket for our documentation team to review.
We are not able to reply to every ticket submitted.