Foros del Web » Creando para Internet » CSS »

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

Estas en el tema de Aplicarle diferente color a la última celda de una tabla? en el foro de CSS en Foros del Web. 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 ...
  #1 (permalink)  
Antiguo 19/01/2010, 10:05
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Aplicarle diferente color a la última celda de una tabla?

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?
  #2 (permalink)  
Antiguo 19/01/2010, 10:19
pr0
 
Fecha de Ingreso: marzo-2004
Mensajes: 687
Antigüedad: 13 años, 8 meses
Puntos: 28
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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

Código CSS:
Ver original
  1. <style>
  2. .resaltado_rojo{
  3.   background-color:#FF0000;
  4. }
  5. </style>

Despues aplicas ese estilo a la celda que quieras:

Código HTML:
Ver original
  1. <tr>
  2. <td></td>
  3. <td class="resaltado_rojo"></td>
  4. </tr>
Logicamente puedes aplicarlo a las celdas que quieras.

Espero que te sirva. Saludos.
  #3 (permalink)  
Antiguo 19/01/2010, 11:17
Avatar de masterojitos  
Fecha de Ingreso: julio-2008
Ubicación: Lima Callao Chucuito
Mensajes: 1.931
Antigüedad: 9 años, 4 meses
Puntos: 105
Respuesta: Aplicarle diferente color a la última celda de una tabla?

podrias resolverlo de la siguiente manera:

Código HTML:
Ver original
  1. <tr>
  2. <th>cabezera 1</th>
  3. <th>cabezera 2</th>
  4. <th>cabezera N</th>
  5. </tr>
  6. <tr>
  7. <td>dato 1</td>
  8. <td>dato 2</td>
  9. <td>dato N</td>
  10. </tr>
  11. <tr>
  12. <td>dato 1</td>
  13. <td>dato 2</td>
  14. <td>dato N</td>
  15. </tr>
  16. <tr>
  17. <tr>
  18. <td>pie 1</td>
  19. <td>pie 2</td>
  20. <td>pie N</td>
  21. </tr>

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.
__________________
Atte. MasterOjitos :ojotes:
Todo sobre Programación Web
Las ultimas tendencias en Efectos y Recursos Web: MasterOjitos Blog
  #4 (permalink)  
Antiguo 19/01/2010, 11:41
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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?
  #5 (permalink)  
Antiguo 19/01/2010, 14:25
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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¡¡
__________________
Revisa las FAQ's antes de disparar.
  #6 (permalink)  
Antiguo 19/01/2010, 14:55
Avatar de Tecna  
Fecha de Ingreso: enero-2010
Mensajes: 291
Antigüedad: 7 años, 11 meses
Puntos: 45
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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.
  #7 (permalink)  
Antiguo 20/01/2010, 06:36
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

como uso el clase :last-child que mencionaste?..
  #8 (permalink)  
Antiguo 21/01/2010, 14:14
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

ayuda =(, como uso el last-child?
  #9 (permalink)  
Antiguo 21/01/2010, 14:18
 
Fecha de Ingreso: agosto-2008
Mensajes: 469
Antigüedad: 9 años, 3 meses
Puntos: 20
Respuesta: Aplicarle diferente color a la última celda de una tabla?

¿Te suena google?

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

Saludos¡¡
__________________
Revisa las FAQ's antes de disparar.
  #10 (permalink)  
Antiguo 21/01/2010, 14:31
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 9.968
Antigüedad: 9 años, 8 meses
Puntos: 1314
Respuesta: Aplicarle diferente color a la última celda de una tabla?

Cita:
Iniciado por Impostor Ver Mensaje
¿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
__________________
Grupo Telegram Docker en Español
  #11 (permalink)  
Antiguo 21/01/2010, 23:43
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

entonces, cual es la mejor solucion?, como le aplico otro color a la ultima celda de la forma mas facil?
  #12 (permalink)  
Antiguo 22/01/2010, 06:29
Avatar de masterojitos  
Fecha de Ingreso: julio-2008
Ubicación: Lima Callao Chucuito
Mensajes: 1.931
Antigüedad: 9 años, 4 meses
Puntos: 105
Respuesta: Aplicarle diferente color a la última celda de una tabla?

como estas mostrando la tabla????
las filas son creadas dinamicamente por registros de base de datos o como es ????
__________________
Atte. MasterOjitos :ojotes:
Todo sobre Programación Web
Las ultimas tendencias en Efectos y Recursos Web: MasterOjitos Blog
  #13 (permalink)  
Antiguo 23/01/2010, 09:08
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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?
  #14 (permalink)  
Antiguo 23/01/2010, 11:11
 
Fecha de Ingreso: diciembre-2009
Mensajes: 438
Antigüedad: 8 años
Puntos: 16
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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
  #15 (permalink)  
Antiguo 24/01/2010, 08:11
RGT
Usuario no validado
 
Fecha de Ingreso: noviembre-2008
Mensajes: 505
Antigüedad: 9 años
Puntos: 5
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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


hacer eso es lo mejor entonces, cierto?
  #16 (permalink)  
Antiguo 25/01/2010, 01:23
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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.
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #17 (permalink)  
Antiguo 25/01/2010, 02:40
 
Fecha de Ingreso: diciembre-2009
Mensajes: 438
Antigüedad: 8 años
Puntos: 16
Respuesta: Aplicarle diferente color a la última celda de una tabla?

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.

Etiquetas: celda, color, diferente, tablas
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:10.