Study/HTML&CSS
[HTML/CSS] 가상 클래스 (pseudo class)
Rajin
2021. 11. 29. 15:28
728x90
- 가상 클래스(pseudo class)
- :link 선택자:
- :visited 선택자:
- :hover 선택자:
- :active 선택자:
- :focus 선택자:
- :enabled와 disabled 선택자:
- Checked 선택자:
- Root 선택자:
- :nth-child(n)와 :nth-last-child(n) 선택자:
- :nth-child(n) :
- :nth-last-child(n) :
- 해당 요소들이 모두 부모 요소를 갖고 있어야 한다.
- :target 선택자: 앵커 목적지에 스타일 적용
- :not 선택자: 특성 요소가 아닐 때 스타일 적용(괄호 안에 있는 요소 제외) | p:not(#ex) {color:blue;}
- 가상요소 | 내용 일부만 선택해 스타일 적용할 때 사용, 클래스 이름 앞에 콜론 두 개(::)를 붙여서 표시
- ::first-line와 ::first-letter 요소: 첫 번째 줄, 첫 번째 글자에 스타일 적용 | ::first-letter에서 첫 번째 글자는 반드시 첫 번째 줄에 있어야 함
- ::before, ::after요소: 내용 앞 뒤에 콘텐츠(text, img 등) 추가
- 사용자 동작에 반응하는 가상 클래스