계단식 스타일 시트의 캐스케이드가 의미하는 바를 배우십시오.

캐스케이드는 CSS 스타일 시트를 매우 유용하게 만듭니다. 즉, 캐스케이드는 충돌하는 스타일을 적용하는 방법의 우선 순위를 정의합니다. 즉, 두 가지 스타일이있는 경우 :

p {color : red; }p {color : blue; }

계단식은 스타일 시트에 빨간색과 파란색으로 표시되어야한다고 명시되어 있어도 단락이 있어야하는 색상을 결정합니다. 궁극적으로 하나의 색상 만 단락에 적용될 수 있으므로 순서가 있어야합니다. 그리고이 순서는 셀렉터 ( 피 위 예제에서) 우선 순위가 가장 높으며 문서에서 어떤 순서로 표시되는지를 나타냅니다.

다음 목록은 브라우저가 스타일에 대한 우선 순위를 결정하는 방법을 단순화 한 것입니다.

스타일 시트에서 요소와 일치하는 선택기를 찾습니다. 정의 된 스타일이 없으면 브라우저에서 기본 규칙을 사용하십시오
표시된 선택자를 스타일 시트에서 확인하십시오. !중대한 적절한 요소에 적용합니다.
스타일 시트의 모든 스타일은 기본 브라우저 스타일을 덮어 씁니다 (사용자 스타일 시트의 경우 제외).
스타일 선택기가 구체적 일수록 우선 순위가 높아집니다. 예를 들어, div> p.class 보다 구체적입니다. 피. 클래스 보다 구체적입니다. 피.
마지막으로 두 규칙이 동일한 요소에 적용되고 동일한 선택기 우선 순위를 갖는 경우로드 된 규칙 마지막 적용될 것이다. 즉, 스타일 시트는 위에서 아래로 읽히고 스타일은 서로 위에 적용됩니다.