CSS nth child - 每行第一个TD,交替颜色？

Question

希望我能解释一下我想做什么.

在一张桌子里.每行中的第一个TD应该交替颜色.

这可能使用第n个孩子吗？

我尝试了一些东西,但似乎无法逻辑地围绕这一个.

(试图扩大我的视野)

<tr>
  <td>#0068b3</td>
  <td>#fff</td>
  <td>#fff</td>
</tr>
<tr>
  <td>#aebde1</td>
  <td>#fff</td>
  <td>#fff</td>
</tr>
<tr>
  <td>#0068b3</td>
  <td>#fff</td>
  <td>#fff</td>
</tr>
<tr>
  <td>#aebde1</td>
  <td>#fff</td>
  <td>#fff</td>
</tr>

Answer 1

您可以使用even/ odd在tr元素之间切换并选择第一个子td元素:

这里的例子

table tr:nth-child(even) td:first-child {
    background:#0068b3
}
table tr:nth-child(odd) td:first-child {
    background:#aebde1
}