選擇除了第一個孩子之外的奇數元素

Question

我有像這樣的div元素

<div id="container">
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
    <div id="content">
        <div class="arrow"></div>
    </div>
</div>

我想選擇第一個孩子，但我有一個像這樣的CSS

#container #content:nth-child(odd) .arrow {
    background: red;
}
#container #content:nth-child(even) .arrow {
    background: green;
}
#container #content:first-child .arrow {
    background: pink;
}

但是，第一個孩子是紅色的，因為第一個孩子是一個奇數。

我嘗試使用這個，我不知道它是否會起作用但它沒有

#container #content:nth-child(odd):not(:first-child) .arrow {
    background: red;
}

但是，第一個div的箭仍然是紅色的。

我究竟做錯了什么？

Answer 1

:nth(odd)只是一個快捷鍵:nth(2n+1) ，如果內存服務，所以我認為:nth(2n+3)可能有效。

Answer 2

試試這個：

#container #content:first-child .arrow {
    background: pink!important;
}

這優先考慮了這個價值

問候！