css - :nth-child 和 :last-child

Question

代码：

<table>
   <tr>
       <td></td>
       <td></td>
       <td></td>
       <td colspan="2"></td>    <==== Only this
   </tr>
   <tr>
       <td></td>
       <td></td>
       <td colspan="3"></td>
   </tr>
   <tr>
       <td></td>
       <td></td>
       <td></td>
       <td></td>
       <td></td>
   </tr>
</table>

我只想选择第四个“td”，但前提是它是最后一个。我可以这样做吗？

tr td:last-child:nth-child(4) { /* Some Style  */ }

Answer 1

是的你可以

tr td:last-child:nth-child(4) { background: red; }

Answer 2

你可以像这个演示一样使用

tr td:nth-of-type(4):last-child {
    /*some code here*/
     }

或者

tr td:nth-child(4):last-child {
    background-color: red;
     }

Answer 3

我认为这是不可能的。如果你想让它工作，那么你可以添加一个特定的class或id你想要的td元素。

Answer 4

尝试这个

$("tr").each(function(){
    if($(this).find("td:nth-child(4)").is(':last-child')) {
     $(this).find("td:nth-child(4)").css("color","red");   
    }
});

小提琴