¿Cómo seleccionar el primer y el último TD seguidos?

¿Cómo puedes seleccionar el primero y el último TDde una fila?

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

Se podría utilizar el :first-childy :last-childpseudo-selectores:

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

Esto debería funcionar en todos los navegadores principales, pero IE7 tiene algunos problemas cuando los elementos se agregan dinámicamente (y no funcionará en IE6).

Puede usar el siguiente fragmento:

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

Usando las siguientes pseudo clases:

: primer hijo significa "seleccione este elemento si es el primer hijo de su padre".

: last-child significa "seleccione este elemento si es el último hijo de su padre".

Solo los nodos de elementos (etiquetas HTML) se ven afectados, estas pseudo-clases ignoran los nodos de texto.

Puede usar : first-child y : last-child pseudo-selectors :

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

O puedes usar otra forma como

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

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

Ambas formas funcionan perfectamente

Si usa sass (scss) puede usar el siguiente fragmento:

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

Si la fila contiene algunas thetiquetas iniciales (o finales) antes de td, debe usar los :first-of-typey los :last-of-typeselectores. De lo contrario, el primero tdno se seleccionará si no es el primer elemento de la fila.

Esto da:

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