CSS

캐스케이딩

Made Project 2021. 2. 25. 00:02
  • 엘리먼트는 다양한 CSS 선언의 영향을 받는다. 이 때 충돌을 피하기 위해서 우선순위를 정하는데 이를 캐스케이딩이라고 함.
  • 캐스케이딩에는 다음과 같이 세가지 규칙이 있음.
    • 중요도  - css가 어디에 선언 되었는지에 따라서 우선순위가 달라짐
    • 명시도  - 대상을 명확하게 특정할수록 명시도가 높아지면서 우선순위가 높아짐
    • 소스순서 - css 선언을 나중에 할수록 우선순위가 높아짐

css는 다양한 위치에서 기술될수 있는데, 그 위치에 따라서 우선순위가 달라진다. css가 기술될 수 있는 위치는 아래와 같고, 우선순위는 아래로 내려갈수록 높다. (저작자 CSS의 !important가 제일 높음)

  1. 브라우저의 CSS  (예 <h1>제목</h1>)
  2. 사용자 CSS 일반선언  (오페라에서 제한적으로 사용되는 기능)
  3. 저작자 CSS 일반선언  (  h1 { color:red} ) 저작자는 이 페이지를 만들고 css를 디자인한 사람
  4. 저작자 CSS의 !important
h1 {
	color:red
}

h1 { 
	color:puple !important
}

이 엘리먼트의 import를 지정하면 이것의 의해서 가장 높은 우선순위를 갖게 된다.

 

복잡한 관계에 의해서 결과적으로 엘리먼트나 그룹을 이팩트를 부여하고 싶을 때 또는 

css의 디버깅을 할때 사용합니다.