CSS 선택자의 Specificity를 계산하고 비교합니다
| 선택자 | 예시 | 명확도 |
|---|---|---|
| Inline style | style="..." | 1,0,0,0 |
| ID 선택자 | #navbar | 0,1,0,0 |
| Class 선택자 | .active | 0,0,1,0 |
| 속성 선택자 | [type="text"] | 0,0,1,0 |
| 가상 클래스 | :hover, :nth-child() | 0,0,1,0 |
| 요소 선택자 | div, p, span | 0,0,0,1 |
| 가상 요소 | ::before, ::after | 0,0,0,1 |
| 전체 선택자 | * | 0,0,0,0 |
| 결합자 | >, +, ~, (space) | 0,0,0,0 |