css3第n个类型限制为类[重复]

Question

有没有办法将 css3 的 nth-of-type 限制为一个类？我有一个动态数量的section 元素，它们具有不同的类来指定它们的布局需求。我想每第三个.module 抓取一次，但似乎nth-of-type 查找类元素类型，然后计算类型。相反，我想将其限制为仅.modules。

谢谢！

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;
  }​

Answer 1

不幸的是，没有办法（至少我不知道）选择一个类的nth-of-type，因为nth-of-class 不存在。您可能必须手动为每三个 .module 添加一个新类。

Answer 2

看来你真正想要的是css4 :nth-match selector，但大多数浏览器还没有真正支持它，所以目前唯一的方法是使用javascript

$(".featured.module").filter(function(index, element){
    return index % 3 == 2;
}).addClass("third");

http://jsfiddle.net/w3af16dj/