[CSS] CSS 선택자(Selector), 요소 선택하기

 

 

 

태그 이름

See the Pen Untitled by HyerinKim (@blogerin) on CodePen.

 

 

클래스/아이디

See the Pen Untitled by HyerinKim (@blogerin) on CodePen.

 

 

자식 (children)

See the Pen children by HyerinKim (@blogerin) on CodePen.

 

 

직속 자식 (direct children)

See the Pen direct children by HyerinKim (@blogerin) on CodePen.

 

 

복수 선택

See the Pen 복수 선택 by HyerinKim (@blogerin) on CodePen.

 

 

여러 조건

See the Pen 여러 조건 by HyerinKim (@blogerin) on CodePen.

 

 

가상 클래스 (Pseudo-class)

콜론(:)을 사용하면 몇 가지 '가상 클래스'를 선택할 수 있다

1) n번째 자식

See the Pen n번째 자식 by HyerinKim (@blogerin) on CodePen.

 

2) 마우스 오버 (hover)

See the Pen Untitled by HyerinKim (@blogerin) on CodePen.