Tree-Structural Pseudo-classes
단순한 선택자나 선택자 조합으로 표현할 수 없는 구조적인 추가 정보를 기반으로 요소를 선택할 수 있도록 한다. DOM 트리 내의 요소에만 적용되며 CSS에 의한 가상 요소는 대상이 아니다.
관련 선택자 유형
:empty
자식 요소(텍스트, 공백 포함)가 존재하지 않는 경우에 선택자로 사용된다.
:first-child
같은 레벨(형제) 요소 그룹 중에서 첫 번째 요소를 선택자로 사용한다.
:first-of-type
같은 레벨(형제) 관계 요소 그룹 중에서 선택자와 동일한 타입의 첫 번째 요소를 선택자로 사용한다.
:last-child
같은 레벨(형제) 요소 그룹 중에서 마지막 요소를 선택자로 사용한다.
:last-of-type
같은 레벨(형제) 관계 요소 그룹 중에서 선택자와 동일한 유형의 마지막 요소를 선택자로 사용한다.
:nth-child()
같은 레벨(형제) 관계의 요소 그룹에서 인수로 지정한 순서에 해당하는 요소를 선택자로 사용한다.
:nth-last-child()
같은 레벨(형제) 요소 그룹 중에서 뒤에서 부터 인수로 지정된 위치 값으로 요소를 선택자로 사용한다.
:nth-last-of-type()
같은 레벨(형제) 요소 그룹 내에서 선택자와 동일한 타입을 기준으로 뒤에서 부터의 위치 값을 인수로 지정해 해당되는 요소를 선택자로 사용한다.
:nth-of-type()
같은 레벨(형제) 요소 그룹 (단위)내에서 선택자와 동일한 타입을 갖는 대상중에 인수로 지정된 위치(순서) 값을 갖는 요소를 선택자로 사용한다.
:only-child
동등 레벨(형제)이 없는 단일 요소를 선택자로 사용한다.
:only-of-type
선택자와 동일한 타입으로서 동등 레벨(형제)이 없는 단일 요소인 경우에만 선택자로 사용된다.
:root
웹 문서의 최상위 요소를 선택자로 사용한다.
W3C Modules