클래스 선택자와 그 효과

CSS/HTML에 익숙하지 않아 영어가 기본이 아니므로 클래스 간의 관계를 이해하는 데 문제가 있습니다. 나는 예로 이동합니다클래스 선택자와 그 효과

.classA .classB { 
 
    color: red 
 
} 
 

 
.classC { 
 
    color: blue 
 
}

<div class="classA"> 
 
    <p class="classB classC"> 
 
    This text is red 
 
    </p> 
 
</div>

내 질문은 : 그것은 .classC에 정의 된 스타일을 적용하지 않는 이유는 무엇입니까?

2017-09-27 CMig

.classA .classB이 더 구체적이기 때문에. 그런 다음 .classC.

당신이 쓰는 것입니다 경우

.classA .classC {color:blue}

는 그 다음이 적용됩니다.

은 자세한 내용은 당신이 specificity 때문이다 MDN CSS Specificity

2017-09-27 13:50:06

좀 걸릴 수 있습니다.

간단히 말해서 첫 번째 규칙은 매우 구체적인 계층 구조를 설명하기 때문에 두 번째 규칙보다 구체적입니다.

2017-09-27 13:50:16

첫 번째 CSS 규칙의 정확도가 이므로입니다. (즉, 구글 ...)

을이 특정한 경우에, 단순히 말했다 : ...

2017-09-27 13:51:01 Johannes

그건 "두 개의 클래스가 하나 개의 클래스를 이길"때문에 중첩 된 클래스와 규칙 : .classA .classB {color: red} 간단한 .classC {color:blue}보다 우선합니다.

2017-09-27 13:51:23

답변