Por Nacho Palou — 16 de Septiembre de 2005

CSS Table Gallery es una colección de distintos atributos CSS para dar estilo a tablas HTML. Los distintos estilos se van aplicando a la tabla que contiene la lista de estilos para ver «en vivo» como quedan cada una de las opciones disponibles. Se puede elegir entre un aspecto tipo iTunes, uno con los colores del Café con leche o uno más clásico, por ejemplo.

(Vía trendalicious!)

Compartir en Facebook  Tuitear

12 comentarios

#1Darki

:O muy util ! gracias ;)

#2 — Neo

Matrix rocks

#3 — Anonymous

Pero las tablas ya no estaban desfasadas y no se usaban?

#4Kid_A

Excelente, es lo que estaba buscando.

Mil gracias

#5 — Anonymous

#3 las tablas estan desfasadas para estructurar una web... pero es obvio (como su propio nombre indica) que para presentar informacion en tablas, se siguen usando

#6Scila

¿Como se hace para que tr alternos tengas estilos diferentes? aparte de metiendolo a mano, claro. Me refiero a si existe alguna subclase o algo para la paridad de las tr...

#7inkel

Scila, en CSS3 (si no me equivoco) tienes una pseudo clase "nth-child" (n-avo hijo), por lo que podrias tener algo como:

tr:nth-child(2n+1) { background: #eee }

que serian todos los tr impares (2 * n + 1 siempre es impar). Con lo mismo podrias tener algo como

tr:nth-child(3n) { }

que haria que aquellos tr cuya posicion sea divisible por 3.

Mas info en la especificacion de selectores de CSS3

#8Scila

Muchas gracias inkel, me refería exactamente a eso. En CSS2 nada, no?
Lo más parecido que me suena es :firt-child y :after y :before, pero no se me ocurre como montar una sentencia que funcione, no creo que se pueda.

#9Nacho

no me suena que en CSS2 se pueda. también está la th para la cabecera de la tabla que automáticamente daría un estilo distinto del resto de tr, pero no alternativamente que es lo que preguntabas - la opción de inkel parece bastante buena (si la pruebas Scila no dices!)

#10Scila

Lo he probado y al parecer no lo soporta ni el firefox 1.5 beta. Pero supongo que será correcto, también debería aceptar :nth-child(even) y :nth-child(odd) para par/impar sin necesidad de recurrir al 2n y 2n+1.
Habrá que esperar a futuras versiones de navegador supongo.

#11inkel

En Opera tampoco funciona. Creo recordar que alguna vez lo vi funcionando, pero mi mente podria estar tomandome el pelo.

#12inkel

Nacho: no seria correcto utilizar th. th debe utilizarse para demarcar que el contenido de esa celda corresponde a una cabecera de columna/fila. Si lo utilizas para mostrar datos pierde todo el sentido semantico.

Si, ya se, soy un freak...