Version: Unity 6.0 (6000.0)
언어 : 한국어
UI 스타일링
USS 선택자

USS 소개

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

USS 파일을 사용하여 게임과 애플리케이션에 있는__ UI__(사용자 인터페이스) 사용자가 애플리케이션과 상호 작용하도록 해 줍니다. Unity는 현재 3개의 UI 시스템을 지원합니다. 자세한 정보
See in Glossary
요소의 모습과 스타일을 정의할 수 있습니다. USS를 통해 UI 요소의 모습과 스타일을 나머지 코드에서 분리하여 애플리케이션의 디자인을 더 쉽게 관리하고 유지할 수도 있습니다.

USS를 사용하면 별도의 USS 파일에서 버튼, 레이블, 이미지, 기타 UI 요소의 스타일을 정의한 후 게임이나 애플리케이션 코드에 이러한 스타일을 적용할 수 있습니다. 이렇게 하면 코드를 변경하지 않고도 USS 파일을 수정하여 애플리케이션의 모습을 변경할 수 있습니다.

USS는 다음 요소로 구성됩니다.

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

구문

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

selector {
  property1: value;
  property2: value;
}

규칙을 통한 스타일 매칭

스타일시트를 정의하면 이를 시각적 트리에 적용할 수 있습니다. 선택자는 요소와 매칭되어 USS 파일에서 적용되는 프로퍼티를 결정합니다. 선택자가 요소와 매칭되는 경우 스타일 선언이 해당 요소에 적용됩니다.

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

Button {
  width: 200px;
}

지원되는 선택자 유형

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

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

USS는 특정 상태의 요소를 대상으로 지정하거나 :root 요소를 선택하기 위해 선택자와 함께 사용할 수 있는 유사 클래스도 지원합니다.

요소가 둘 이상의 선택자와 일치하는 경우 USS는 우선권을 갖는 선택자의 스타일을 적용합니다.

참고: 모든 선택자는 대소문자를 구분합니다.

단순 선택자

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

|선택자 유형| 구문|일치 |-|-|-| |유형 선택자 |Type {...} | 특정 C# 또는 시각적 요소 유형의 요소입니다.| |클래스 선택자 | .class {...} | 할당된 USS 클래스가 있는 요소입니다.| |이름 선택자 | #name {..} |할당된 name 속성이 있는 요소입니다.| |유니버설 선택자 | * {...} |모든 요소입니다.|

복잡 선택자

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

|선택자 유형| 구문|일치 |-|-|-| |자손 선택자 |selector1 selector2 {...} | 시각적 트리에 있는 다른 요소의 자손인 요소입니다.| |자식 선택자 | selector1 > selector2 {...} | 시각적 트리에 있는 다른 요소의 자식인 요소입니다. | |다중 선택자 | selector1selector2 {...} |모든 단순 선택자와 일치하는 요소입니다.|

요소에 스타일 연결

다음과 같은 방법으로 스타일을 요소에 연결할 수 있습니다.

  • UI 빌더에서 인라인 스타일 또는 USS 선택자를 사용하여 요소에 스타일을 지정합니다. 자세한 내용은 UI 빌더로 UI 스타일 지정을 참조하십시오.
  • UXML에서 인라인 스타일로 요소에 스타일을 지정하거나 이 요소와 일치하는 선택자가 있는 스타일시트를 연결합니다. 자세한 내용은 UXML에 스타일 추가를 참조하십시오.
  • C# 스크립트에서 style 프로퍼티에 직접 스타일을 설정하거나 요소와 일치하는 선택자가 있는 styleSheet 프로퍼티에 USS 스타일시트를 추가합니다. 자세한 내용은 C# 스크립트에서 스타일 적용을 참조하십시오.

추가 리소스

UI 스타일링
USS 선택자