추천 과정：class CSS .

선택자

정의와 사용법 .class 선택자는 특정 속성 값을 가진 요소를 선택합니다。 class CSS

속성 값을 가진 요소를 선택합니다。.) 문자, 그 뒤에 class 특정 class를 가진 모든 유형의 요소를 선택하려면, 점 (

요소.class 선택자는 특정 속성 값을 가진 요소를 선택합니다。 class 속성 값을 가진 요소를 선택합니다。

특정 속성 값을 가진 요소를 선택하려면 class 의 요소 유형을 선택하려면, 요소 이름을 적고 점 (.) 문자, 그 뒤에 class 속성 값（아래의 예제 2를 참조하십시오）。

ヒント：HTML 요소는 여러 가지를 참조할 수 있습니다 class（아래의 예제 3을 참조하십시오）。

예제

예제 1

class="intro"의 모든 요소의 스타일을 선택하고 설정합니다：

.intro {
  background-color: yellow;
}

직접 시험해 보세요

예제 2

class="intro"의 모든 <p> 요소의 스타일을 선택하고 설정합니다：

p.intro {
  background-color: yellow;
}

직접 시험해 보세요

예제 3

.class 선택자의 다른 사용법:

/* class="center"의 모든 요소를 선택 */
.center {
  text-align: center;
}
/* class="large"의 모든 <p> 요소를 선택 */
p.large {
  font-size: 200%;
}
/* class 목록에 "fancy"과 "beige"가 포함된 모든 <p> 요소를 선택 */
p.fancy.beige {
  font-family: 'Courier New', monospace;
  background-color: beige;
  border: 2px solid green;
}
/* class="ex1"의 <p> 요소 내 모든 class="ex2"의 요소를 선택 */
p.ex1 .ex2 {
  background-color: yellow;
}

직접 시험해 보세요

CSS 문법

.class {
  css 선언;
}

CSS 문법

요소.class {
  css 선언;
}

기술 세부 사항

브라우저 지원