가장 기본적인 선택자(Selector)에 대해 알아보자!
* - 모든 요소 선택 * {
font-size: 20px;
}
tag - 해당 태그 이름을 가진 모든 요소 선택 div {
font-size: 20px; /* 태그 이름이 `div`인 요소 선택 */
}
.class - 해당 클래스 특성을 가진 모든 요소 선택 .box {
font-size: 20px; /* 클래스가 box인 요소 선택 */
}
#id - 해당 아이디 특성을 가진 모든 요소 선택
해당 id를 가진 요소는 문서 내 하나만 존재해야 함
#box {
font-size: 20px; /* 아이디가 box인 요소 선택 */
}
, - 여러 선택자를 같이 사용할 때 ,로 구분하여 연결
같은 코드를 여러번 작성할 필요가 없어 코드가 간결해짐
h1, h2 {
color: orange;
}