我有一个table,它的__abc1是动态创建的。我知道如何得到第一个和最后一个孩子,但我的问题是:
table
是否有一种方法获得使用CSS的第二个或第三个孩子?
对于现代浏览器,使用td:nth-child(2)作为第二个td,使用td:nth-child(3)作为第三个。记住,它们检索第二个和第三个td 对于每一行。
td:nth-child(2)
td
td:nth-child(3)
如果需要兼容版本9以上的IE,请使用兄弟组合子或JavaScript 如Tim所建议的。也请参阅我对这个相关的问题的回答,以了解他的方法的解释和说明。
IE 7 &8(以及其他不支持CSS3的浏览器,不包括IE6),你可以使用以下方法来获取第2和第3个子节点:
孩子2:
td:first-child + td
第三个孩子:
td:first-child + td + 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*/ }