nth-of-type 작동 방법에 대한 설명이 필요합니다.

Question

이 코드가 있는데이 유형의 첫 번째 형제 인 경우 nth-of-type selector가 1이 아닌 2가되어야하는 이유를 알 수 없습니다. https://jsfiddle.net/xj5hvn16/

누군가가, 나에게 이것을 설명시겠습니까 :

여기 jsfiddle 코드는?

.flowbox .utm_registrars_code:nth-of-type(2) { 
 
    background-color: red; 
 
}

<div class="flowbox freebox"> 
 
    <div class="pholdcard18"></div> 
 
    <div class="flowcard14 utm_registrars_code"> 
 
    <div class="content"> 
 
     Content 1 
 
    </div> 
 
    </div> 
 
    <div class="flowcard14 utm_registrars_code"> 
 
    <div class="content"> 
 
     Content 2 
 
    </div> 
 
    </div> 
 
    <div class="flowcard14 utm_registrars_code"> 
 
    <div class="content"> 
 
     Content 3 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

즉 선택된 클래스

와 A 경우 div에서 특정 유형의 제 요소, 그리고 최초의 요소 nth-of-type 시작하는 이유는 n 번째의 형() 의사 - 클래스는 문서 트리에서 동일한 확장 요소 이름을 가진 형제 + b 형제를 갖고, n의 0 또는 양의 정수 값을 가지며 부모가 인 요소를 나타냅니다.

상세 정보 :

• https://www.w3.org/wiki/CSS/Selectors/pseudo-classes/:nth-of-type
• https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-of-type

Answer 2

nth-of-type는 nth-of-class을 의미하지 않는다!

div 형의 첫 번째 요소는

<div class="pholdcard18"></div> 

는 따라서 사용자의 Content 1 소자 번째이고 강조된다.