[CSS] CSS 선택자 (Selector)

전체 선택자

*{   }

 

 

 

타입 선택자

태그명{  }

 

 

 

class 선택자

<태그 class="클래스명">

.클래스명{   }

 

 

 

id 선택자

<태그명 id="id명">

#id명{   }

** id값은 하나만 존재해야함

 

 

 

그룹 선택자

태그, 태그{   }

 

 

 

하위 선택자

.box div

: box 안에 모든 요소를 선택

 

 

 

자식 선택자

.box > div

: box의 자식 div들 선택 (div의 자식들은 선택X)

 

 

 

형제 선택자

h1 ~ p {   }

: h1 다음에 오는 모든 p 선택

 

 

 

인접 형제 선택자

h1 + p {   }

: h1 다음에 오는 첫번째 p 선택

 

 

 

태그 관계

부모태그: 바로 윗단의 태그

자식태그: 부모태그 바로 아랫단에 있는 태그들

형제관계: 같은 부모 태그를 둔 태그