CSS 선택자의 특이성을 계산하세요. ID, 클래스, 요소 선택자의 우선순위를 분석합니다.
이 도구는 CSS 선택자의 특이성을 계산하여 우선순위를 분석합니다. ID, 클래스, 요소 선택자의 개수를 세어 특이성 점수를 계산합니다.
CSS specificity is the algorithm browsers use to decide which CSS property values are applied to an element when multiple rules could apply. It is calculated as a tuple of three values (a, b, c): a = number of ID selectors, b = number of class selectors + attribute selectors + pseudo-classes, c = number of element selectors + pseudo-elements.
Specificity is calculated by counting the number of each selector type in a selector string: (a) ID selectors (#id), (b) class selectors (.class), attribute selectors ([attr]), and pseudo-classes (:hover), and (c) element selectors (div) and pseudo-elements (::before). The !important declaration overrides specificity entirely.
An ID selector (#id) always outranks any number of class selectors because specificity is not a base-10 number — it is a tuple. (1, 0, 0) is always greater than (0, 100, 0). No amount of classes can beat a single ID.
No, the universal selector (*) has zero specificity and does not contribute to the specificity calculation.