사이드바 영역으로 건너뛰기

[CSS]3. 캐스캐이딩(Cascading)

 

3. 캐스캐이딩(Cascading)

3.1. 캐스캐이딩과 캐스캐이딩 순서(Cascading Order)



3. 캐스캐이딩(Cascading)

3.1. 캐스캐이딩과 캐스캐이딩 순서(Cascading Order)
cascade의 사전적 의미는 작은 폭포를 뜻한다. 그러나 지금 우리가 여기서 언급하는 캐스캐이딩은 이러한 사전적 의미와는 다소 다르다.
하나의 문서가 이미 내장하고 있는 스타일 정보가 있다고 하자. 만약 외부파일의 스타일이 이 문서에 적용이 되는 경우에 같은 요소에 대하여 서로 다른 스타일이 정의될 수 있다. CSS2에서는 이럴 때 우선순위가 가장 큰 스타일시트를 적용할 수 있도록 하고 있다. 이것을 캐스캐이딩이라고 한다.
익스플로러 4.0같은 경우에는 사용자가 스타일을 정의할 수 있도록 하고 있는데, 브라우저 사용자가 정의해 놓은 스타일시트는 웹 문서 작성자의 스타일시트보다 비중이 낮다. 따라서, 이 경우에는 웹 문서 작성자의 스타일시트가 우선적으로 적용된다.
스타일을 정의할 때 뒤쪽에 !important를 붙여주면 모든 것에 우선하게 된다.

  H1 { color: black ! important; background: white ! important }
P { font-size: 12pt ! important; font-variant: italic } /*font-variant만 중요도가 낮다.*/

순서대로 우선순위가 높다.
- id 속성을 쓰면 우선순위가 가장 높다.
- class 등 속성을 쓰면 우선순위가 높다.
- Selector로 사용한 요소의 수가 많으면 우선순위가 높다.
- STYLE 요소 안에 정의한 것보다 style 속성으로 정의한 것이 우선순위가 높다.


진보블로그 공감 버튼트위터로 리트윗하기페이스북에 공유하기딜리셔스에 북마크