Dando estilo a tablas de forma sencilla

Escrito por J.F. el Martes, 9 de Octubre del 2007 a las 9:38

Un script con el cual podremos dar un bonito estilo a tablas sin necesidad de andar con id´s y nombres de clase. Simplemente has de descargar los archivos, y poner las siguientes líneas en el head:

TEXTO PLANO

HTML:

1. <link href="tablecloth/tablecloth.css" rel="stylesheet" type="text/css" media="screen" />
2. <script type="text/javascript" src="tablecloth/tablecloth.js"></script>

De ésta manera cuando en tu código haya una tabla, se le dará el estilo que ves más abajo en la fotografía, marcandose la fila y columna de la celda sobre que te posiciones o sobre la que hagas click. Es personalizable poniéndo algunos parámetros a true o false. La tabla basta con que tenga la siguiente estructura:

TEXTO PLANO

HTML:

1. <table cellspacing="0" cellpadding="0">   
2.     <tr>               
3.         <th>Title</th>
4.         <th>Title</th>
5.         <th>Title</th>
6.         <th>Title</th>
7.     </tr>
8.     .
9.     .
10.     .
11. </table>

El resultado es el siguiente:

Enlace: | Tablecloth, ejemplos y descarga del script

Categoria: Recursos, CSS, Javascript

• Añadir este post a
• Del.icio.us -
• Meneame -
• Digg -
• Webeame

Entradas relacionadas

Deja un comentario

Nombre (obligado)

E-mail (no sera publicado) (obligado)

Pagina web

Puedes usar las siguientes etiquetas HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>