Plugin jQuery para darle estilo a sus tablas html

En este artículo vamos a mencionar la existencia de un script de código abierto que te permite estilizar tus tablas html a través de jQuery.

Para utilizar este plugin necesitaremos utilizar la librería jQuery, el plugin styletable y los estilos necesarios que incluiremos en el <head> de nuestra página.

<link rel="stylesheet" type="text/css" href="SyntaxHighlighter.css" />
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="styletable.jquery.plugin.js"></script>

Para añadir los estilos a nuestras tablas deberemos también incluir en el <head> de nuestra página algo como lo que sigue:

$('table#table2').styleTable({
            th_bgcolor: '#3E83C9',
            th_color: '#ffffff',
            th_border_color: '#333333',
            tr_odd_bgcolor: '#ECF6FC',
            tr_even_bgcolor: '#ffffff',
            tr_border_color: '#95BCE2',
            tr_hover_bgcolor: '#BCD4EC'
        });

Después en el <body> añadir como id de nuestras tablas id=”table2″. Además de esto, las cabeceras de la tabla deberán contener las etiquetas <thead><th></th></thead>.

Para ver con más claridad su funcionalidad y como utilizarlo puedes ver los ejemplos en funcionamiento.

Autor
Escrito por Jose Aguilar - Director ejecutivo y tecnológico en JA Modules. Experto programador PrestaShop y Experto programador WordPress.
Te ha servido? Valora esta entrada!
1 estrella2 estrellas3 estrellas4 estrellas5 estrellas (2 votos, promedio: 5,00 de 5)
Cargando…
Comparte en las redes sociales

6 respuestas a “Plugin jQuery para darle estilo a sus tablas html”

  1. Carlos dice:

    Quisiera saber, si es posible, como se alinean los texto a la izquierda, derecha o centro, gracias.

  2. christian dice:

    como me bajo los archivos para las tablas

  3. Casey Mcclymonds dice:

    I think this internet site has got very excellent written subject material posts.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.

Ver más sobre