
[CSS] 가상 클래스 선택자
Frontend/CSS
2022. 10. 20. 21:48
가상 클래스 선택자란? 가상선택자는 기본선택자 뒤에 :(콜론)을 붙인 가상 클래스를 의미합니다. 선택자중에서 첫번째, 마지막, 짝수, 홀수번째의 요소를 선택하고 싶을때 등 사용한다. [사용방법] 선택자:가상클래스 { property : value } 아래의 h1 태그가 있다고 가정합니다. begin CSS1 begin CSS2 begin CSS3 begin CSS4 begin CSS5 :first-child - 첫번째 요소의 CSS를 변경하고 싶을때 :last-child - 마지막 요소의 CSS를 변경하고 싶을때 /* #0000FF 파란색*/ /* #8A2BE2 보라색*/ /* #FACBBA 살구색*/ /* #FFD700 노란색*/ h1:first-child { color : #0000FF; } h1:l..