Cascading (캐스캐이딩)
사전적의미
- 폭포같은
- 위에서 아래로 흐르는
- 계속되는
- 연속적인
캐스케이딩 원칙이란 CSS에서 적용되는 원칙입니다. 하나의 요소에 여러 개의 스타일이 중복되는 상황에서 어떤 스타일을 적용할 것인지를 결정하는 일종의 스타일 적용 규칙입니다. 캐스케이딩 원칙에는 크게 2가지가 있는데 하나는 스타일 우선순위와 관련된 원칙이며, 다른 하나는 스타일 상속과 관련된 원칙입니다.
📌스타일 우선순위
스타일 우선순위를 결정하는 요소에는 중요도, 명시도, 코드 순서 이렇게 3가지가 있습니다.
⭐중요도
우선 중요도는 스타일이 선언된 곳에 따라 우선순위가 결정되는 것을 의미하는데, 프로그래머, 즉 작성자의 스타일 시트가 가장 우선순위가 높고, 그 다음으로 사용자의 스타일 시트, 그리고 가장 마지막으로 브라우저의 스타일 시트 순으로 우선해서 스타일이 적용됩니다.
⭐명시도
그리고 그 다음 요소인 명시도의 경우에는 명시도가 높을 수록 우선순위가 높은데, 명시도가 높다는 것은 사용된 셀렉터의 의미가 명확해 적용범위가 적음을 의미합니다. 예를 들어 개별적인 요소에 적용되는 인라인이나 id속성의 스타일이 가장 우선순위가 높고, span, div 이런 구획을 지칭하는 태그들의 경우에는 우선순위가 낮습니다.
⭐코드순서
코드 순서의 경우에는 위에서 아래로 코드를 읽어나가는 기계의 방식에 영향을 받아 가장 나중에 온, 코드 문서 중 가장 하단의 스타일이 최우선으로 적용됩니다.
📌스타일 상속
스타일 상속의 원칙같은 경우에는 부모 요소와 자식 요소의 스타일 적용 상황에서 자식 요소가 부모 요소에 속해있는 것으로 보고 부모의 스타일을 그대로 받아서 적용되는 원칙을 의미합니다. 자식 요소가 따로 스타일을 가지고 있다면 그 스타일이 적용이 되지만(명시도와도 일맥상통하는 원칙) 그렇지 않다면 부모의 스타일을 따릅니다.
