가상 클래스
가상 클래스는 선택자에 추가하는 키워드 입니다. 요소가 어떤 특정한 상태가 되었을때 태그를 선택하겠다는 의미로 사용 됩니다.
문법 👉 선택자 : 가상클래스이름 {속성: 속성값;}
대표적인 가상 클래스
- :link 👉 아직 방문하지 않은 요소를 나타냅니다. href 속성을 가진 a, area,link 태그 중 방문하지 않은 모든 요소를 선택합니다.
- :visited 👉 사용자가 방문한 적이 있는 링크를 나타냅니다.
- :active 👉 사용자가 활성화한 요소를 나타냅니다. 클릭하고 누르고 있는 상태를 말한다.
- :hover 👉 사용자의 마우스 포인터가 요소 위에 올라가 있으면 선택됩니다.
- :focus 👉 양식의 입력 칸 등 포커스를 받은 요소를 나타냅니다. 보통 사용자가 요소를 클릭, 탭 하거나 키보드 tab 키로 선택했을 때 또는 input 태그에서 입력할려고 입력칸을 클릭했을 때 작동 합니다.
- :disabled 👉 비활성 상태의 요소로 선택 합니다.
- :nth-child 👉 형제 사이에서의 순서에 따라 요소를 선택합니다.
만약 link, visited, hover, active 가상 클래스를 사용할때는 link 👉 visited 👉 hover 👉 active 순서로 선언하여야 혹시나 적용되지 않는 일이 발생하지 않습니다.