:
과 ::
의 차이많은 사람들이 :
과 ::
를 구분하지 않고 사용한다. (나 또한 둘 중 하나를 써보고.. 안되면 바꾸는 식으로..)
최신 브라우저에서는 문제가 없지만 차이를 이해할 필요가 있다!
:
는 가상 클래스(pseudo-class)를 나타내며, HTML 문서의 일부를 DOM 트리 구조와는 상관 없는 방법으로 선택할 때 사용된다.
:hover
,:active
,:focus
,:link
,:checked
,:not()
,:disabled
,:nth-of-type()
등
::
는 가상 요소(pseudo-element)를 나타내며 곧 문서에 나타난 것 외에 추가로 정의된 DOM 트리의 추상화 레이어이다.
::after
,::before
,::first-letter
등