CSS 계승, 레이 어드, 특지 도

1349 단어 css

판권 소유, 전재 출처 밝 혀 주세요.http://qyj.iteye.com위반 자 는 반드시 추궁 한다!
 
//css  
div{
 background-color:red;
 font-size:12px;
 color:white;
}

//html  
<div>
 <p>welcome qyj.iteye.com</p>
</div>

 이 페이지 는 렌 더 링 된 후에 DIV 에 적용 되 었 던 스타일 도 단락 에 응용 되 었 고 스타일 은 계승 되 었 습 니 다. p 는 div 의 후손 이기 때 문 입 니 다.
계승 은 CSS 에서 매우 중요 한 특징 이다.하위 요 소 는 따라서 부모 요소 의 특징 을 가지 게 됩 니 다.
 
모든 CSS 스타일 을 레이 어드 스타일 시트 라 고 합 니 다. 선택 부 호 는 위 에서 아래로 레이 어드 관계 에 따라 일치 하기 때 문 입 니 다.즉, 여러 개의 선택 문자 가 하나의 요소 에 스타일 을 적용 하면 나중에 정 의 된 규칙 은 먼저 정 의 된 규칙 을 덮어 씁 니 다.
//css  
p{
 color : red;
}

p{
 color : green;
}

//html  
<p>welcom qyj.iteye.com</p>

 최종 렌 더 링 이 끝 난 후 단락 의 색상 은: green 입 니 다.
 
나중에 정 의 된 규칙 은 일반적으로 먼저 정 의 된 규칙 을 덮어 쓰 지만 모두 그렇지 는 않다.여기 에는 특수 한 문제 가 언급 되 어 있 으 니 코드 를 보 세 요.
//css  
p.highlight{
 color : red;
}

p{
 color : green;
}

//html  
<p class="highlight">welcom qyj.iteye.com</p>

 최종 렌 더 링 후 단락 색상 은 red, p. highlight 입 니 다. 더 구체 적 인 선택 문자 입 니 다.만약 두 개의 선택 부호 가 같은 특수 지 도 를 가지 고 있다 면, 이때 정 의 된 것 이 이 길 수 있다.

좋은 웹페이지 즐겨찾기