奇怪甚至在tr不工作

Question

https://jsfiddle.net/v2tgjLjv/

这个选择器出了什么问题？

tr:odd {
  background: green;
}

tr:even {
  background: lightgreen;
}

Answer 1

你应该使用nth-child：

tr:nth-child(odd) {
  background: green;
}

tr:nth-child(even) {
  background: lightgreen;
}

:odd和:even是jQuery伪元素选择器而不是css。

Answer 2

tr:nth-child(even) {background: red}
tr:nth-child(odd) {background: green}

<table>
  <tr class="d0">
    <td>one</td>
  </tr>
  <tr class="d1">
    <td>two</td>
  </tr>
  <tr class="d1">
    <td>two</td>
  </tr>
  <tr class="d1">
    <td>two</td>
  </tr>
</table>

Answer 3

	tr:nth-child(odd) {
	  background-color: green;
	}
	
	tr:nth-child(even) {
	  background-color: lightgreen;
	}

<table>
<tr><td>1</td></tr>
<tr><td>1</td></tr>
<tr><td>1</td></tr>
<tr><td>1</td></tr>
<tr><td>1</td></tr>
</table>

使用所有代码<table>和<td>。还可以使用:nth-child(odd)和:nth-child(even)代替:odd和:even。这是我的JSFiddle：https://jsfiddle.net/v2tgjLjv/9/