여러 요소에 동일한 스타일을 지정하려면 클래스를 사용하십시오.
클래스를 사용하면, 클래스를 태그와 연관시켜 다양한 태그에 동일한
스타일을 지정할 수 있습니다.
여러 클래스를 동일 태그 발생마다
연관시키면 동일 태그에 여러 스타일을 지정할 수 있습니다.
클래스 스타일을
작성하고 적용하려면 다음을 수행하십시오.
- 프로젝트 탐색기 보기에서 파일을 두 번 클릭하여
편집할 .css 파일을 여십시오. 편집 영역에서 스타일시트가 열립니다.
- 클래스 스타일을 작성하려면 다음을 수행하십시오.
- 스타일 규칙 추가 아이콘(
)을 클릭하십시오. 새 스타일의
선택기 설정 대화 상자가 열립니다.
- 클래스 단일 선택 단추를 선택하십시오.
클래스 이름 필드에 클래스 이름을 지정하십시오.
이름은 마침표로 시작해야 합니다(예: .note). ID 옵션은
클래스 옵션과 기능이 거의 동일합니다. 유일한 차이점은 ID를 페이지의
한 위치(하나의 태그)에만 적용할 수 있다는 점입니다. 따라서, ID가 아닌 클래스를 사용하는 것이 좋습니다. ID를
사용 중일 경우에는 ID 단일 선택 단추를 선택하고
ID 필드에 이름을 입력하십시오. 이름은
#로 시작해야 합니다.
- 확인을 클릭하십시오.
- 스타일 추가 대화 상자를 사용하여 특정 스타일 정의를 추가하십시오.
- 확인을 클릭하여 변경사항을
저장하십시오. 지정한 클래스 이름이 스타일 보기에 표시됩니다.
- 요소에 클래스를 적용하려면 다음을 수행하십시오.
- Page Designer의 디자인 페이지에서 요소를 선택하십시오.
- 특성 보기에서 클래스 필드 옆에 있는 찾아보기 아이콘(
)을 클릭하십시오.
클래스 선택 대화 상자가 열립니다.
- 스타일시트를 펼치고 원하는 클래스를 선택하십시오.

- 확인을 클릭하십시오.
- ID 스타일을 적용하려면 다음을 수행하십시오.
- ID 스타일을 적용하려는 요소를 선택하십시오.
- 특성 보기에서 모든 속성 아이콘(
)을 클릭하십시오.
- ID 필드에 ID 이름을 입력하십시오(#없이).

- 동일한 방법으로 다른 요소를 선택하고 동일한 클래스 스타일을 적용할 수 있습니다. 스타일 도구 모음에서 정의된 클래스 스타일을 적용할 수도 있습니다.
Page Designer에서 을 선택하여 스타일 도구 모음을 표시하십시오. 드롭 다운 목록에서 클래스 이름을 선택하여 초점이 놓인 요소에
클래스 스타일을 적용할 수 있습니다.
- 스타일시트에서 사용 중인 클래스 정의를 보려면 스타일 보기에서
스타일을 클릭하십시오. 특성 보기에서 스타일 정의를 확인할 수
있습니다.