css - 匹配指定元素之前的元素

Question

我有以下列表:

<ul>
  <li class="parent">1.</li>
  <li class="child">1. first</li>
  <li class="child">1. second</li>
  <li class="child">1. third</li>

  <li class="parent">2.</li>
  <li class="child">2. first</li>
  <li class="child">2. second</li>
  <li class="child">2. third</li>
  <li class="child">2. fourth</li>
  <li class="child">2. fifth</li>

  <li class="parent">3.</li>
  <li class="child">3. first</li>
  <li class="child">3. second</li>
  <li class="child">3. third</li>
  <li class="child">3. fourth</li>

  <li class="parent">4.</li>
  <li class="child">4. first</li>
  <li class="child">4. second</li>
  <li class="child">4. third</li>
</ul>

我想为 first 和 last 元素设置指定的背景。虽然我对 first 没有问题:

.parent + .child {
  background-color: whitesmoke;
}

那我就不知道怎么处理鞋楦了。

简单地说:我想在 .parent 之前匹配 .child。

Answer 1

li:nth-child(2n+2) {
  background-color: whitesmoke;
}

您正在寻找第 n 个子选择器。 http://jsfiddle.net/mKH7j/