<分区>
<分区>
有没有办法将 CSS 3 的 nth-of-type 限制为一个类？我有一个动态数量的 section 元素，其中不同的类指定了它们的布局需求。我想捕获每三个 .module，但似乎 nth-of-type 查找类元素类型，然后计算类型。相反，我想将其限制为仅 .module。
JSFiddle 演示:http://jsfiddle.net/danielredwood/e2BAq/1/
HTML:
<section class="featured video">
<h1>VIDEO</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO (3)</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO</h1>
</section>
<section class="featured module">
<h1>NOT A VIDEO (6)</h1>
</section>
CSS:
.featured {
width: 31%;
margin: 0 0 20px 0;
padding: 0 3.5% 2em 0;
float: left;
background: #ccc;
}
.featured.module:nth-of-type(3n+3) {
padding-right: 0;
background: red;
}
.featured.video {
width: auto;
padding: 0 0 2em 0;
float: none;
}
最佳答案
不幸的是，没有任何方法(至少我不知道)来选择类的 nth-of-type，因为 nth-of-class不存在。您可能需要手动向每三个 .module 添加一个新类。
关于CSS 3 nth of type 仅限于类，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49142661/
相关文章：
javascript - 无法在 Fancybox 底部添加 20px 的内边距
javascript - Highcharts:如何突出显示 yAxis 值？
javascript - 你如何将类映射到一个数组，这个数组之前是一个 HTMLcollection
java - 在 Java NIO 中，选择器对客户端 SocketChannel 有用吗？
css - 第 nth-child 在瞄准一个时隐藏了我所有的元素
asp.net - ValidationSummary 样式在 Post asp.net 的 IE 6 中不显示