jQuery 设置交替颜色行

Question

我正在寻找我的问题的具体答案。这是，我有一行包含一定数量的 div（动态设置）。我想要的是交替将 div（3 个 div）的背景设置为另一种颜色，如下所示：这可以通过 CSS 奇数和偶数伪类来完成，还是应该通过 jQuery?

来完成

Answer 1

您可以将此添加到您的 CSS.. foo:nth-child(n+3)

更新：

ul li:nth-child(6n+4),
ul li:nth-child(6n+5),
ul li:nth-child(6n+6) {
  border: 1px solid red;
}

^ 虽然我不是粉丝，但它确实有效。

http://codepen.io/pacMakaveli/pen/JdWYoM

Answer 2

通过添加 td:nth-child(3n) 进行尝试，它可能适合您

Answer 3

您可以使用：

li:nth-child(6n),
li:nth-child(6n - 1),
li:nth-child(6n - 2) {background: red;}

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 6</li>
  <li>Item 7</li>
  <li>Item 8</li>
  <li>Item 9</li>
  <li>Item 10</li>
  <li>Item 11</li>
  <li>Item 12</li>
  <li>Item 13</li>
  <li>Item 14</li>
  <li>Item 15</li>
</ul>
<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 6</li>
  <li>Item 7</li>
  <li>Item 8</li>
  <li>Item 9</li>
  <li>Item 10</li>
</ul>

jQuery 设置交替颜色行

jQuery set alternating color rows

css

jquery

rows

alternating