Personnaliser son tableau

Ce billet est une suite de celui de Kelly sur le bouclage de la boucle!

Aujourd'hui c'est mercredi et mercredi c'est le jour des enfants, donc nous on s'amuse, on met des couleurs partout.

De mon côté je me suis donc amusée à mettre une image dans certaines colonnes/cellules du tableau et à changer la couleur des liens, à mettre une légende, tout ça tout ça.

Donc pour rajouter une légende, c'est pas dur, après la balise <table> on ajoute la balise <caption> -légende (ici la légende est contenue dans la variable $caption)- </caption>. En réalité, vous pouvez mettre les balises <caption> où vous le voulez, moi je les ai mises là pour que la légende soit juste au-dessus du tableau et qu'elle fasse la même largeur...

Puis on voudrait que les en-têtes soient bien centrés dans leurs cellules donc dans la balise <tr> on ajoute l'option align="center", si on veut que ce soit à gauche on met "left" et je vous laisse deviner pour la droite (trop dur).

Les cellules des en-têtes sont 'balisées' avec <th> et non <td>. Ici on a rajouté dans la balise <th> l'option background="image.jpg". On aura donc en image de fond l'image appelée image.jpg à condition que celle-ci se trouve dans le même répertoire que le tableau qui sera créé. Donc si elle ne se trouve pas dans le répertoire TABLEAUX mais dans le répertoire IMAGES par exemple il faudra mettre background="IMAGES/image.jpg".

Puis on voudrait que les liens aient une autre couleur, ouais ça pourrait être chouettos!!

Alors comment fait-on? Bah comme ça:

Après la balise <a href> on ajoute une balise <font color=#couleur>, on y met le code couleur désiré, on oublie pas d'échapper les "" sans quoi le dièse sera pris pour un début de commentaire.

Et voilà. Vous avez un super tableau!!

Maintenant, il ne nous reste plus qu'à bidouiller pour avoir un joli tableau avec des supers bordures, de jolis fonds, etc.

Dans un prochain billet (d'ici quelques semaines je pense), on vous expliquera comment vous épargner tout ce mal grâce à la mise en place d'un style CSS (enfin si on trouve le courage)!!