<分区>
标签 html css css-selectors
<分区>
我有这个 HTML 代码:
<div class="products-wrap">
<div class="product-item"></div>
<div class="product-item"></div>
<div class="clearfix-sm"></div>
<div class="product-item"></div>
<div class="clearfix-lg"></div>
<div class="product-item"></div>
<div class="clearfix-sm"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="clearfix-lg"></div>
<div class="product-item"></div>
...etc
</div>
我想使用 CSS 仅选择带有 .product-item 类的第三个 div。我的问题是,:nth-of-type(3n+0) 与所有 div 一起计数,因此跳过第三个 .product-item。
我试过了
.product-wrap > .product-item:nth-of-type(3n+0) {
...
}
但它不起作用。还有其他办法吗?
感谢您的帮助:)
最佳答案
div {
width: 100px;
height: 40px;
border: 1px solid;
}
.product-item:nth-child(3n+1) {
background-color: red;
}
<div class="products-wrap">
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
<div class="product-item"></div>
</div>
关于html - 如何从多个类别中选择第 n 个类型?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31785937/