CSS
캐스케이딩
Made Project
2021. 2. 25. 00:02
- 엘리먼트는 다양한 CSS 선언의 영향을 받는다. 이 때 충돌을 피하기 위해서 우선순위를 정하는데 이를 캐스케이딩이라고 함.
- 캐스케이딩에는 다음과 같이 세가지 규칙이 있음.
- 중요도 - css가 어디에 선언 되었는지에 따라서 우선순위가 달라짐
- 명시도 - 대상을 명확하게 특정할수록 명시도가 높아지면서 우선순위가 높아짐
- 소스순서 - css 선언을 나중에 할수록 우선순위가 높아짐
css는 다양한 위치에서 기술될수 있는데, 그 위치에 따라서 우선순위가 달라진다. css가 기술될 수 있는 위치는 아래와 같고, 우선순위는 아래로 내려갈수록 높다. (저작자 CSS의 !important가 제일 높음)
- 브라우저의 CSS (예 <h1>제목</h1>)
- 사용자 CSS 일반선언 (오페라에서 제한적으로 사용되는 기능)
- 저작자 CSS 일반선언 ( h1 { color:red} ) 저작자는 이 페이지를 만들고 css를 디자인한 사람
- 저작자 CSS의 !important
h1 {
color:red
}
h1 {
color:puple !important
}
이 엘리먼트의 import를 지정하면 이것의 의해서 가장 높은 우선순위를 갖게 된다.
복잡한 관계에 의해서 결과적으로 엘리먼트나 그룹을 이팩트를 부여하고 싶을 때 또는
css의 디버깅을 할때 사용합니다.