: 과 :: 의 구분

1. 가상 클래스(pseudo-class) :

문서 트리 콘텐츠와 관련된 경우 뿐만 아니라, 탐색기 히스토리(:visited), 콘텐츠의 상태, 마우스의 위치 등에 관련한 특정 상태에 따라 선택자에 css요소를 부가하고 싶을 경우 사용한다.

:hover, :active, :focus, :link, :checked, :not(), :disabled...

2. 가상 요소(pseudo-element) ::

문서 트리 콘텐츠에 정의된 것 뿐만 아니라, 외부에서 추가로 정의된 DOM트리의 추상화 레이어도 포함한다. 가상 클래스와 달리, 요소의 특정 상태에 관하여 스타일을 적용할 때 사용됨.

:first-line, :first-letter, :placeholder, :selection, :after, :before...

!important

CSS는 같은 속성을 여러 번 정의했을 때, 나중에 적용된 속성이 적용된다. 만약, 나중에 설정된 속성이 적용되지 않게 하려면, 적용하고 싶은 속성값 뒤에 !important를 작성한다. !important가 적용된 속성간의 우선순위는, 나중에 적용된 속성이며 다른 속성간의 우선순위는 !important가 작성된 속성이다.