爲什麼nth類型行爲像第n個孩子？

Question

我試圖替換某個類的元素的顏色，並忽略它們之間不同類的任何元素。 nth-of-type應提供此功能，但在Firefox和Chrome中，它的行爲不正確。

http://jsfiddle.net/rbe5oz52/

<div class="parent"> 
    <div class="section">Section</div> 
    <div class="section">Section</div> 
    <div class="ignoreMe">IgnoreMe</div> 
    <div class="section">Section</div> 
    <div class="section">Section</div> 
</div> 

.parent .section 
{ 
    background-color: yellow; 
} 

.parent .section:nth-of-type(2n+1) 
{ 
    background-color: red; 
} 

它應該顯示的部分爲紅色，黃色，紅色，黃色，但ignoreMe元素拋出這一關，並導致兩個黃色成一排。

的定義說，這應該工作的方式我想： https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-of-type

這是一個更加靈活和實用的僞選擇，如果你想，以確保您無論身在何處選擇同一類型的標籤的它在父元素內部，或者其他不同的標籤出現在它之前。

我該如何解決這個問題？

Answer 1

.parent .section 
{ 
    background-color: red; 
} 

.parent .section:nth-of-type(2n+1) 
{ 
    background-color: yellow; 
} 

http://jsfiddle.net/shellyjindal/hL97tn2x/5/