Version: 2022.1
언어: 한국어
UI 스타일링
USS 선택자

USS 소개

Unity 스타일시트(USS)는 스타일 규칙을 지원하는 에셋으로 인식되는 텍스트 파일입니다.USS 텍스트 파일의 확장자는 ’.uss’여야 합니다.

USS는 다음으로 구성됩니다.

  • 선택자와 선언 블록을 포함하는 스타일 규칙
  • 스타일 규칙의 적용을 받는 시각적 요소를 식별하는 선택자
  • 하나 이상의 스타일 선언이 있는 중괄호 안에 있는 선언 블록각 스타일 선언에는 프로퍼티와 값이 있습니다.각 스타일 선언은 세미콜론으로 끝납니다.

구문

다음은 스타일 규칙의 일반적인 구문입니다.

selector {
  property1: value;
  property2: value;
}

규칙을 통한 스타일 매칭

스타일시트를 정의하면 비주얼 트리에 적용할 수 있습니다.선택자는 요소와 일치하여 USS 파일에서 어떤 프로퍼티가 적용되는지 확인합니다.선택자가 요소와 일치하면 스타일 선언이 해당 요소에 적용됩니다.

예를 들어 다음의 규칙은 모든 Button 오브젝트와 매칭됩니다.

Button {
  width: 200px;
}

지원되는 선택자 타입

USS는 다음과 같이 다양한 기준에 따라 요소를 매칭시키는 여러 유형의 단순 및 복잡 선택자를 지원합니다.

  • 요소 C# 타입 이름
  • 할당된 name 프로퍼티
  • USS 클래스 리스트
  • 시각적 트리에서 요소의 위치 및 다른 요소와의 관계

USS는 또한 특정 상태의 요소를 타겟팅하거나 ‘:root’ 요소를 선택하기 위해 선택자와 함께 사용할 수 있는 유사 클래스를 지원합니다.

요소가 둘 이상의 선택자와 일치하는 경우 USS는 [우선권을 갖는] 선택자의 스타일을 적용합니다(UIE-uss-selector-priority).

단순 선택자

USS는 CSS의 단순 선택자와 유사하지만 동일하지는 않은 단순 선택자 집합을 지원합니다.다음 표는 USS 단순 선택자에 대한 빠른 레퍼런스를 제공합니다.

선택자 타입 구문 매치
Type 선택자 Type {...} 특정 C# 또는 시각적 요소 타입의 요소입니다.
Class 선택자 .class {...} USS 클래스가 할당된 요소입니다.
Name 선택자 #name {..} name 속성이 할당된 요소입니다.
Universal 선택자 * {...} 임의의 요소입니다.

복잡 선택자

USS는 CSS 복잡 선택자의 하위 세트를 지원합니다.다음 표는 USS 복잡 선택자에 대한 빠른 레퍼런스를 제공합니다.

선택자 타입 구문 매치
Descendant 선택자 selector1 selector2 {...} 시각적 트리에서 다른 요소의 자손인 요소입니다.
Child 선택자 selector1 > selector2 {...} 시각적 트리에서 다른 요소의 자식인 요소입니다.
Multiple 선택자 selector1selector2 {...} 모든 단순 선택자와 일치하는 요소입니다.

추가 리소스

UI 스타일링
USS 선택자