CSS/개념정리
[선택자] 클래스 선택자 (Class Selector)
xowoony
2022. 9. 6. 16:55
학습일 : 2022. 09. 05
클래스 선택자 (Class Selector)
CSS 속성(Property)을 적용하기 위해 사용하는 선택자 중 하나로, 태그가 가진 클래스의 이름을 활용하되,
그 이름 앞에 마침표(.)를 붙인다.
다음과 같이 작성한다. ("는 없는 것으로 한다.)
.클래스 이름 {
속성 : 속성 값;
속성 : 속성 값;
속성 : 속성 값;
}
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>클래스 선택자</title>
<style>
.human.girl.short {
color: purple;
}
.human.girl.smart {
color: orange;
}
.human {
color: red;
}
.human.girl {
color: blue;
}
</style>
</head>
<body>
<kim class="human">김씨</kim>
<lee class="human girl short smart">이씨</lee>
<park class="human">박씨</park>
</body>
</html>
==============실행결과===============