[CSS] SELECTOR - 선택자

 

선택자 : 스타일 속성을 적용하는 요소

 

1. 전체 선택자 : 스타일을 모든 요소에 적용할 때 사용

- *(별표)를 사용

- 문서의 여백이나 글꼴 크기 등 기본 스타일을 초기화할 때 사용

 

2. 태그 선택자 : 특정 태그에 스타일 적용

<p></p>

p {
    font-size: 12px; /*글자 크기*/
    font-family: 돋움; /*글꼴*/
}

 

3. 클래스 선택자 : 특정 클래스에 스타일 적용 

- 클래스 앞에 .(마침표)를 붙여야 함

<p class="hello"></p>

.hello {
    color: blue;
}

 

4. id 선택자 : 특정 id에 스타일 적용

- 마침표 대신 #기호를 붙여야 함

<div id="bello"></div>

#bello {
    background: yellow; /*배경 색*/
    width: 400px;
    height: 200px;
}

 

5. 그룹 선택자 : 둘 이상 요소에 같은 스타일 적용