[TIL] 22.03.15 (005) 가상 선택자

오늘 배운 것

 

1. 패캠 실습 중 querySelector 안에 들어가는 : 의 존재가 궁금했다.

답 : CSS 선택자의 가상 클래스(pseudo-class) 

알고보니 css에서 items :hover { } 설정하는 그 : 였다. querySelectorAll('ul > li:last-child') 여기서도 쓰이던 애.

정적인 items의 css와 hover를 얹었을 때의 css는 적용값이 다른데, 원래대로라면 둘을 구별하기 위해 class가 추가로 사용되어야 한다.

그러나 css를 적용하려고 class를 추가한다면 html가 지저분해져서,  stylesheet 상에서 '가상의 클래스'를 만들어 쓰는 것. 

   * 가상클래스 설명글 1

   * 가상클래스 설명글 2

css를 적용하기도, js에서 선택해 오기도 훨씬 수월해진다!