WEBBOOK CHAPTER

모던 CSS, 기본에서 실무까지: 4장. Cascade와 명시도

4장. Cascade와 명시도

Cascade는 importance, origin, context, layer, specificity, scoping proximity, source order를 거쳐 승자를 정한다. “아래에 썼으니 이긴다”는 마지막 조건 하나만 본 설명이다. inline style나 !important로 급히 덮으면 다음 변경 비용이 커진다.

명시도는 대략 ID, class·attribute·pseudo-class, type·pseudo-element 열로 비교한다. :where()의 명시도는 0이라 라이브러리 기본값을 낮게 제공할 때 유용하고, :is()·:not()·:has()는 인수의 명시도 영향을 받는다.

문제 해결 순서는 computed value 확인, 승리 선언 출처 확인, selector 계약 수정, layer 수정이다. !important는 사용자 안전·utility override처럼 의도한 경계에서만 쓰고 이유를 주석으로 남긴다.