Aplicarle diferente color a la última celda de una tabla?

[RGT]

Hola, tengo una tabla, y en la última celda tengo un texto que quiero resaltar.
Hay algun código que a la última celda de la tabla me le ponga un tipo de color diferente?, ya sea tamaño de letra, color de fondo, lo que desée?.

Es posible aplicarle cambios sólo a la última celda?, o también a la penultima celda?

[pr0]

Primero creas un estilo con el color que quieres de fondo en la celda.

Código CSS:

<style>
.resaltado_rojo{
  background-color:#FF0000;
}
</style>
 

Despues aplicas ese estilo a la celda que quieras:

Código HTML:

<table>
<tr>
<td></td>
<td class="resaltado_rojo"></td>
</tr>
</table>
 

Logicamente puedes aplicarlo a las celdas que quieras.

Espero que te sirva. Saludos.

[masterojitos]

podrias resolverlo de la siguiente manera:

Código HTML:

<table>
<thead>
<tr>
<th>cabezera 1</th>
<th>cabezera 2</th>
<th>cabezera N</th>
</tr>
</thead>
<tbody>
<tr>
<td>dato 1</td>
<td>dato 2</td>
<td>dato N</td>
</tr>
<tr>
<td>dato 1</td>
<td>dato 2</td>
<td>dato N</td>
</tr>
</tbody>
<tfoot>
<tr>
<tr>
<td>pie 1</td>
<td>pie 2</td>
<td>pie N</td>
</tr>
</tfoot>
</table>
 

thead >> es la primera fila (cabezera de la tabla)
tbody >> es el cuerpo de la tabla
tfoot >> es la ultima fila (pie de la tabla)

Suerte.

[RGT]

Mi codigo es este:

Código:

table{
	font-family: "normal", Verdana, Arial, Helvetica, sans-serif;
	font-size:  80%;
	border-collapse: collapse;
	border-top: 2px solid #353535;
	border-bottom: 2px solid #353535;
	width: 609px;
}

tr{
	background-color: #FFF;
}

tbody tr:hover{
	background-color: #ECEFF5;
}

td, th{
	border: 1px dotted #CCCCCC;
}

tbody td
{
	padding: 0.4em;
}

td a:link, th a:link{
	color: #3B5998;
	background: transparent url(images/icons/adjunto.gif) no-repeat;
    padding-left:15px;
}

td a:visited, th a:visited{
	color: black;
	text-decoration: none;
	background: transparent url(images/icons/bajado.gif) no-repeat;
    padding-left:15px;
}

td a:hover, th a:hover{
	text-decoration: none;
	background: transparent url(images/icons/bajar.gif) no-repeat;
    padding-left:15px;
}

Entonces, hay alguna forma de que automaticamente, que en todas las ultimas tablas sea de color diferente, osea, si tienes una tabla con 7 celdas, que siempre la ultima celda sea de color azul xD.

Si tienes otra con 10 celdas que la ultima sea de color azul xD, no se si me entiendes, sin necesidad de cambiar el codigo html?

[Impostor]

CSS solo da estilos como han indicado los compañeros antes, lo que tu quieres es "programar" y con css eso no es posible, ignoro si se puede con php o javascript.

Saludos¡¡

[Tecna]

Buenas,

también se puede usar la pseudo clase :last-child disponible en css 3 que aplicaría los estilos sobre el ultimo hijo del elemento indicado. Esto te serviría sea cual sea el número de elementos hijos.También se añade la pseudo clase :nth-child(expresión) que permite identificar cualquier hijo de un elemento sustituyendo expresión por un número o incluso por expresiones complejas.

Por otro lado no se que uso harás de las tablas pero no es recomendable su uso para la maquetación de la página, se deben usar unicamente para tabular datos.

[RGT]

como uso el clase :last-child que mencionaste?..

[RGT]

ayuda =(, como uso el last-child?

[Impostor]

¿Te suena google?

Ademas, esa propiedad es css3, por lo que pocos navegadores te la van a aceptar.

Saludos¡¡

[Carlangueitor]

Iniciado por Impostor

¿Te suena google?

Ademas, esa propiedad es css3, por lo que pocos navegadores te la van a aceptar.

Saludos¡¡

De hecho es una propiedad de CSS2 pero no todos lo navegadores soportan del todo los psdeudoselectores.

Saludos

[RGT]

entonces, cual es la mejor solucion?, como le aplico otro color a la ultima celda de la forma mas facil?

[masterojitos]

como estas mostrando la tabla????
las filas son creadas dinamicamente por registros de base de datos o como es ????

[RGT]

La tabla esta en HTML, le doi colores, color de fondo, color de letra por CSS.
Arriba puse mi codigo CSS, entonces, cómo le pongo un color diferente a la última celda, cuál es la forma mas fácil entonces?

[Osdiwe]

Si te refieres a toda la última fila la mejor solución es la que te dió masterojitos. Si te refieres a la última celda de toda la tabla la mejor solución es la de pr0. Pero si te refieres a todas las celdas que estarían en la última columna de la tabla (es decir, la última celda de cada fila) entonces puedes usar los tags <colgroup> y especificar un estilo a toda una columna:

http://www.desarrolloweb.com/articul...abla-html.html
https://developer.mozilla.org/es/HTML/Elemento/colgroup

[RGT]

<td class="resaltado_rojo"></td>


hacer eso es lo mejor entonces, cierto?

[daPhyre]

Definitivamente esa es la solución más sencilla. Cualquier otra sería mucho más compleja. Te recomiendo que en lugar de llamarle "resaltado_rojo" le llames "ultima_celda", ya que si luego quieres cambiar de color rojo a azul, te causará dolores de cabeza por el choque ilógico del color. Suerte.

[Osdiwe]

Totalmente de acuerdo con daPhyre. Mejor asignar nombres de clase que no tengan relacion con los colores, etc, así se pueden modificar sin que pierdan el sentido y la lógica.