5. 가상 클래스 선택자
가상 클래스 선택자는 요소의 상태를 이용해 선택자를 지정하는 방법입니다. 가상 클래스 선택자 앞에는 : 기호를 붙입니다.
① 링크 가상 클래스 선택자
• :link 링크를 한 번도 방문한 적 없는 상태
• :visited 링크를 한 번 이상 방문한 적이 있는 상태
② 동적 가상 클래스 선택자
• :hover 마우스를 올린 상태
• :active 마우스로 클릭한 상태
③ 입력 요소 가상 클래스 선택자
• :focus 입력 요소에 커서가 활성화된 상태
• :checked 체크박스 요소에 체크한 상태
• :disabled 상호작용 요소가 비활성화된 상태
• :enabled 상호작용 요소가 활성화된 상태
④ 구조적 가상 클래스 선택자
• :first-child, :last-child 첫 번째 자식 태그와 마지막 자식 태그
• :nth-child(n), :nth-last-child(n) n번째 자식 태그와 끝에서 n번째 자식 태그
• :nth-of-type(n), :nth-last-of-type(n) n번째 특정 자식 태그와 끝에서 n번째 특정 자식 태그
• :first-of-type, :last-of-type 부모의 첫 번째 특정 자식 태그와 마지막 특정 자식 태그