사용자 지정 스타일 클래스 및 규칙 만들기

의 스타일 클래스 규칙 UI 빌더 을 사용하여 CSS 클래스를 참조하여 UI 요소에 사용자 지정 시각적 스타일을 적용합니다.

시작하기 전에

필요한 역할: 관리자

이 태스크 정보

인라인 스타일을 작성하지 않고도 필드, 컨테이너, 버튼 및 기타 인터페이스 구성요소의 모양을 제어하여 UI를 보다 깔끔하고 일관되며 유지관리하기 쉽게 만듭니다. 모든 스타일 클래스와 규칙을 페이지의 모든 컨테이너 또는 구성요소에 적용할 수 있습니다. CSS 스타일에 대한 자세한 내용은 ServiceNow 개발자 사이트 와 ServiceNow 커뮤니티 사이트를 참조하십시오.

프로시저

1. 다음으로 이동 모두 > Now Experience 프레임워크 > UI 빌더.
2. 선택하여 작업할 경험을 열거나 경험을 생성합니다. 작성 > 경험.
   경험 생성에 대한 자세한 내용은 다음을 참조하십시오 에서 사용자가 애플리케이션과 상호 작용하는 방법 구성 UI 빌더 .
3. 페이지를 만들거나 엽니다.
4. 페이지에 구성요소를 추가합니다.
5. 구성 패널에서 스타일 탭을 선택합니다.
6. 스타일 클래스 필드 옆에 있는 ... 아이콘을 선택합니다.
   페이지 클래스 및 규칙 팝업이 나타납니다.
7. 옵션: + 클래스 추가를 선택합니다.
   1. 스타일 클래스 이름 필드에 이름을 입력합니다.
   2. 구성요소에 적용할 CSS 스타일을 제공합니다.
   3. 적용을 선택합니다.
8. 옵션: + 규칙 추가를 선택합니다.
   1. 스타일 규칙 이름 필드에 이름을 입력합니다.
   2. 구성요소에 적용할 CSS 규칙을 제공합니다.
   3. 적용을 선택합니다.
9. 페이지 클래스 및 규칙 팝업을 닫습니다.
10. 스타일 클래스 필드를 선택합니다.
11. 목록에서 스타일 클래스 또는 스타일 규칙을 선택합니다.
12. 저장을 선택합니다.
13. 적용된 스타일 클래스 또는 스타일 규칙을 테스트하려면 미리 보기 를 선택합니다.