我怎样才能得到第二个孩子使用CSS？

我有一个dynamic创buildtd的table 。 我知道如何得到第一个和最后一个孩子，但我的问题是：

有没有办法让第二个或第三个孩子使用CSS？

Answer 1

对于现代浏览器，第二个td使用td:nth-child(2) ，第三个使用td:nth-child(3) 。 请记住，这些检索每行的第二个和第三个td 。

如果您需要与版本9以前的IE兼容，请按照Tim的build议使用兄弟组合器或JavaScript。 另请参阅我对这个相关问题的回答 ，以解释和说明他的方法。

Answer 2

对于IE 7和8（以及其他没有CSS3支持但不包括IE6的浏览器），可以使用以下命令获取第二和第三个子项：

第二个孩子：

 td:first-child + td 

第三个孩子：

 td:first-child + td + td 

然后简单地为你想要select的每个额外的孩子添加另一个+ td 。

如果你想支持IE6也可以做！ 你只需要使用一个小的JavaScript（在这个例子中是jQuery）：

 $(function() { $('td:first-child').addClass("firstChild"); $(".table-class tr").each(function() { $(this).find('td:eq(1)').addClass("secondChild"); $(this).find('td:eq(2)').addClass("thirdChild"); }); }); 

然后在你的CSS中，你只需使用这些类select器来进行你喜欢的任何修改：

 table td.firstChild { /*stuff here*/ } table td.secondChild { /*stuff to apply to second td in each row*/ }