상속 & 우선순위

CSS를 상속하는 속성과 상속하지 않는 속성이 있다.

• 상속하는 속성은 자식 요소에 영향을 끼친다.
• 상속하지 않는 속성은 자식 요소에 영향을 끼지지 않는다.

캐스캐이딩

💡 요소는 하나 이상의 CSS 선언에 영향을 받을 수 있다.
이것을 피하기 위해 캐스캐이딩이 필요!

중요도

CSS가 어디에 선언되었는지에 따라 우선순위가 달라진다.

1. head 요소 내의 style 요소
2. head 요소 내의 style 요소 내의 @Import
3. 로 연결된 CSS 파일
4. 로 연결된 CSS 파일 내의 @import 문
5. 브라우저 디폴트 스타일시트

명시도

대상은 명확하게 특정할수록 명시도가 높아지고 우선순위가 높아진다.

p { color: red !important; } // 1
#thing { color: blue; } // 2
div.food { color: chocolate; } // 3
.food { color: green; } // 4
div { color: orange; } // 5