如何使用CSS来获得特定编号的孩子?

| 我有一个
table
,它的
td
是动态创建的。我知道如何生第一个和最后一个孩子,但我的问题是: 有没有办法让第二个或第三个孩子使用CSS?     
已邀请:
对于现代浏览器,第二个
td
使用
td:nth-child(2)
,第三个
td:nth-child(3)
使用。请记住,它们为每行检索第二个和第三个
td
。 如果需要与版本9之前的IE兼容,请使用Tim推荐的同级组合器或JavaScript。另请参阅我对此相关问题的回答,以获取有关其方法的解释和说明。     
对于IE 7和8(以及其他不支持CSS3的浏览器(不包括IE6)),您可以使用以下命令获取第二个和第三个子代: 第二个孩子:
td:first-child + td
第三个孩子:
td:first-child + td + td
然后,只需为要选择的其他每个孩子再加上一个
+ 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中,您只需使用这些类选择器即可进行所需的任何更改:
table td.firstChild { /*stuff here*/ }
table td.secondChild { /*stuff to apply to second td in each row*/ }
    

要回复问题请先登录注册