[CSS] 캐스케이딩 스타일 시트(css)

캐스케이딩(Cascading)의 의미

• CSS에서 'C'는 캐스케이딩(Cascading)의 약자로 '위에서 아래로 흐르는 스타일 시트'라는 뜻
• 스타일 간의 충돌을 막기 위한 방법이 '위에서 아래로 흐르며 적용되는 방법'
• 이 방법에는 두 가지 원칙이 있음.
  1. 스타일 우선순위 - 스타일 규칙의 중요도, 적용 범위에 따라 우선순위가 결정되고 그 우선순위에 따라 위에서 아래로 스타일이 적용된다.
  2. 스타일 상속 - 태그들의 포함 관계에 따라 부모 요소의 스타일을 자식 요소로, 위에서 아래로 전달한다.

스타일 우선순위

• CSS 선언의 중요성은 스타일이 어디서 선언되었는가에 따라 달라진다. 아래 순서는 가장 중요한 것부터 차례로 나열한 것이다.
  1. 사용자 스타일 시트의 중요 스타일 - '사용자'가 그들에게 맞게 구성해 놓은 스타일 시트 ex) 윈도우의 고대비 설정 기능
  2. 제작자 스타일 시트의 중요 스타일 - 제작자가 만든 스타일 중 !important가 붙은 스타일
  3. 제작자 스타일 시트의 일반 스타일
  4. 기본적인 브라우저 스타일 시트

적용 범위가 어디까지인가?

• 스타일 적용 범위가 좁을수록, 즉 정확히 필요한 요소에만 적용할 스타일일수록 우선 순위가 높아진다.
  1. 인라인 스타일
  2. id 스타일 - 지정한 부분에만 적용되는 스타일이지만 한 문서 안에 한 번만 적용할 수 있다.
  3. 클래스 스타일 - 한 문서 안에 여러 번 적용 가능
  4. 태그 스타일