📌 CSS의 Cascading에 대해 설명해 주세요.
우선적으로 CSS는 Cascading Style Sheet의 줄임말입니다.
여기서 말하는 Cascading이란 ‘위에서 아래로 흐르는’ , ‘상속 또는 종속하는’의 의미를 가지고 있습니다.
따라서 Cascading은 선택자에 적용된 많은 스타일 중에 어떤 스타일로 브라우저에 표현할 지 결정해주는 원리를 의미하게 됩니다.
캐스케이딩은 두 가지 원칙을 따릅니다.
- 스타일 우선순위 (① 중요도 ② 적용범위 ③ 소스 순서)
- 스타일 상속
1-① 중요도
- 1순위 : 사용자 스타일 시트 _ 사용자가 설정한 스타일 (ex. 브라우저 확대 정도)
- 2순위 : 개발자가 만든
!important스타일 _ 속성값 뒤에!important붙이기 (ex.div { color: red !important }) - 3순위 : 개발자가 만든 일반 스타일 _ 기본 CSS
- 4순위 : 기본적인 브라우저 스타일 - 크롬, 네이버 웨일 … etc
1-② 적용 범위
스타일 적용 범위가 좁을수록 우선순위가 높다.
- 1순위 : 인라인 스타일
- 2순위 : id 스타일
- 3순위 : class 스타일
- 4순위 : 태그 스타일
1-③ 소스 순서
나중에 나온 스타일 코드가 먼저 나온 스타일 코드를 덮어쓴다.
