第n个子元素的CSS选择器考虑元素列表，例如组

Question

我有#id_1 input[type='text'] { border-left: 5px solid #FFCC00; }

它们在表4x2中为8（比方说），我只希望右列中的具有这种样式。

我正在尝试：

#id_1 input[type='text']:nth-child(even)

但是它们都不是样式，nth-child（odd）都是样式。

在我看来，这8个元素被视为一个块，而不是像8个元素一样被分离。有关如何解决此问题的一些提示？

Answer 1

id 必须是唯一的，所以选择表内的单元格-td：

table td:nth-of-type(even) {
  border-left: 5px solid #FFCC00;
}

<table>
  <tr>
    <td id="id_1"><input type="text"></td>
    <td id="id_2"><input type="text"></td>
  </tr>
  <tr>
    <td id="id_3"><input type="text"></td>
    <td id="id_4"><input type="text"></td>
  </tr>
  <tr>
    <td id="id_5"><input type="text"></td>
    <td id="id_6"><input type="text"></td>
  </tr>
  <tr>
    <td id="id_7"><input type="text"></td>
    <td id="id_8"><input type="text"></td>
  </tr>
</table>