我需要一個解釋關於如何類型的作品

Question

我有這個代碼，我不知道爲什麼類型的第一選擇器需要是2，而不是1，爲這種類型的第一個兄弟。

這裏有一個的jsfiddle代碼：https://jsfiddle.net/xj5hvn16/

有人可以，請給我講解一下？

.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

這是因爲nth-of-type開始於某種類型的第一個元素，你的情況一div，並與所選擇的類

不是第一元件的：第n的類型（）的僞類表示在文檔 樹中具有+ b 兄弟元素的相同擴展元素名稱的元素，對於任何零或正整數值n，並且具有父元素 元素。

更多信息：

• 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元件是第二和突出顯示。