第n个孩子的问题-它确实计算了所有div,而不是某些类别的div [重复]

问题描述 投票:0回答:1

我正在尝试选择每四个元素并对其应用0的边距。

我有这个:

.products .item:not(.inactive):nth-child(4n) {
    margin-right: 0;
}

我想选择类型为div.item但不是.inactive的第4个元素

我有两个问题:

问题1

如果添加任何div元素(即使它不是.item类型,那么它也包括在计数中。

<div class="products">
<div class="anything"></div>
<div class="item"></div>
<div class="item"></div>
<div class="item"></div> // <- this is where the margin-right: 0 happens
<div class="item"></div> // <- it should happen here
</div>

问题2

如果我添加.inactive类(使用jquery)(基本上隐藏了.inactive元素),则仍会发生上述计数-因此.products div中的所有项目都被考虑在内,margin-right: 0为应用于itemitem inactiveanything等的第四元素。

css css-selectors
1个回答
1
投票

问题1: Using nth-child with arbitary selectors doesn't work

问题2:这与第一个原因相同;但正如您提到的那样,您正在使用jQuery添加nth-child类,因此可以使用jQuery解决inactive问题,而不必使用nth-child

.eq()
.eq()
© www.soinside.com 2019 - 2024. All rights reserved.