Colección de diseños de tablas mediante CSS

ByLuis

Para aquellos que no sean hábiles en el diseño y necesiten de ideas para mejorar el aspecto de las tablas, existe una galería con diseños de tablas mediante CSS.

Hasta ahora hay un total de 71 diseños, que se pueden visualizar en la misma lista, no son screenshots, ni popups, ni enlaces a otras páginas, cuando queremos ver uno de los estilos, se recarga la página y muestra la lista con el estilo seleccionado. También hay una serie de tutoriales sobre tablas y CSS que nos pueden ser de utilidad. Cualquier ayuda siempre es bienvenida.

CSS Table Gallery

Vía / Digg

Similar Posts

hCard con CSS

ByLuis

En 24 ways nos vuelven a regalar un buen artículo sobre cómo mostrar las hCard con estilos.
Claro, el diseño que han realizado quizás no se amolde al nuestro, pero la técnica que usan está bastante bien: usar una imagen de fondo y luego cuatro imágenes para cada esquina.
hcard.gif
Styling hCards with CSS

CSS Frame Generator: obtener la estructura CSS

ByLuis

Buena herramienta que nos devuelve la estructura CSS básica que deberíamos usar para darle estilos a un HTML. Aunque no todos los estilos van a sernos necesarios, si es útil para obtener la estructura inicial y así poder trabajar con algo inicialmente.

Indicando un HTML obtendremos un CSS (vacío) como el siguiente:

#root {  }
#content {  }
#top {  }
#logo {  }
#logo a {  }
#top p.version {  }
#top div.balloon {  }
#top div.balloon h2 {  }
#top div.balloon p {  }
#top div.balloon p strong {  }
#top div.balloon p em {  }
#more.box {  }
#more.box h2 {  }
#more.box p {  }
#more.box ol.properties {  }

CSS Frame Generator

Vía / CSS Globe

Permitir que IE aplique estilos a las etiquetas HTML5

ByLuis

El que los navegadores antiguos o IE no acepten etiquetas HTML5 no suele ser un problema a la hora de mostrarlas, el problema viene a la hora de aplicar estilos e IE que no le aplica los estilos, ya que IE ignora las etiquetas.

header { /* sus estilos */ }
section { /* sus estilos */ }
footer  { /* sus estilos */ }

Para ponerle solución, se puede crear un elemento dinamicamente antes de aplicar los estilos, y por arte de magia (o desesperación) tendrá los estilos al elemento.

html5shiv

Bordes irregulares con CSS3 y webkit

ByLuis

Jugando un poco con las CSS3 y Webkit (en mi caso Chrome) me ha dado por crear bordes irregulares. Lo he hecho mediante -webkit-border-top-left-radius y similares.
El concepto es sencillo, hay dos colores: el de fondo (no puede ser transparente) y el del borde, en las curvas concavas se usan los colores tal cual, y en las curvas convexas se usan al revés (el color borde se simula usando el color de fondo, y el fondo con el borde).
bordeslocos.png
La verdad es que lo he hecho rápido y me he liado bastante y está muy a ojo, pero espero estudiarlo un poco mejor cómo va e incluso hacer un plugin para jquery.
Ejemplo

|

Peculiar: iconos realizados con CSS

ByLuis

Peculiar es un paquete de iconos realizado sólo en CSS. Ha sido creado pensando en sitios y aplicaciones web que dependan de un número muy reducido de peticiones HTTP o que no necesiten o no puedan utilizar ninguna imagen. El paquete contiene 45 pict …

Post original