如何连续选择第一个和最后一个TD？

如何选择TD连续的第一个和最后一个？

tr > td[0],
tr > td[-1] {
/* styles */
}

您可以使用:first-child和:last-child伪选择器：

tr td:first-child,
tr td:last-child {
    /* styles */
}

这应该在所有主流浏览器上都可以使用，但是当动态添加元素时IE7会出现一些问题（它在IE6中不起作用）。

您可以使用以下代码段：

  tr td:first-child {text-decoration: underline;}
  tr td:last-child {color: red;}

使用以下伪类：

：first-child的 意思是“如果此元素是其父元素的第一个子元素，则选择它”。

：last-child的意思是“如果此元素是其父元素的最后一个子元素，则选择它”。

仅元素节点（HTML标记）受到影响，这些伪类将忽略文本节点。

您可以使用：first-child和：last-child pseudo-selectors：

tr td:first-child{
    color:red;
}
tr td:last-child {
    color:green
}

或者您可以使用其他方式

// To first child 
tr td:nth-child(1){
    color:red;
}

// To last child 
tr td:nth-last-child(1){
    color:green;
}

两种方式都可以正常工作

如果使用sass（s​​css），则可以使用以下代码段：

tr > td{
   /* styles for all td*/
   &:first-child{
     /* styles for first */ 
   }
   &:last-child{
    /* styles for last*/
   }
 }

如果行之前包含一些前导（或尾随）th标记，td则应使用:first-of-type和:last-of-type选择器。否则，td如果不是行的第一个元素，则不会选择第一个。

这给出：

td:first-of-type, td:last-of-type {
    /* styles */
}