LES BALISES...5°LES TABLEAUX
- <TABLE>
- Les balises <TABLE> et </TABLE> entourent un tableau. La balise TABLE admet plusieurs attributs.
- BORDER=taille
L'attribut BORDER permet de fixer la taille en pixels des lignes qui délimitent les cellules du tableau. Si cette taille est 0, ces lignes ne sont pas affichées.- WIDTH=taille
L'attribut WIDTH permet de fixer la largeur du tableau en pixels ou en pourcentage de la largeur disponible.- ALIGN="alignement"
L'attribut ALIGN permet de définir l'alignement du tableau dans la largeur de l'espace disponible. Les valeurs possibles sont LEFT, CENTER et RIGHT.- CELLSPACING=taille
L'attribut CELLSPACING permet de définir en pixels l'espace de séparation des cellules.- CELLPADDING=taille
L'attribut CELLPADDING permet de définir en pixels l'espace séparant le bord des cellules de leur contenu. - BORDER=taille
- <TR>
- Les balises <TR> et </TR> délimitent les cellules d'une même ligne d'un tableau.
- <TD>
- Les balises <TD> et </TD> entourent chaque cellule d'un tableau. Chaque cellule du tableau peut contenir des paragraphes, des listes, des images ou d'autres tableaux.
<table border=1 cellpadding=3 cellspacing=1>
<tr>
<td>Cellule L1C1</td>
<td>Cellule L1C2</td>
<td>Cellule L1C3</td>
</tr>
<tr>
<td>Cellule L2C1</td>
<td>Cellule L2C2</td>
<td>Cellule L3C3</td>
</tr>
</table>
Résultat :
| Cellule L1C1 | Cellule L1C2 | Cellule L1C3 |
| Cellule L2C1 | Cellule L2C2 | Cellule L3C3 |
- La balise <TD> admet plusieurs arguments.
- WIDTH=taille
L'argument WIDTH permet de définir la largeur de la cellule en pixels ou en pourcentage de la largeur du tableau.- BGCOLOR="couleur"
L'attribut BGCOLOR permet de définir la couleur de fond de la cellule.- VALIGN="alignement"
L'attribut VALIGN permet de définir l'alignement vertical dans la cellule. Les valeurs possibles sont TOP, MIDDLE et BOTTOM.- COLSPAN=nombre
L'attribut COLSPAN permet de définir le nombre de colonnes de tableau que devra occuper la cellule.- ROWSPAN=nombre
L'attribut ROWSPAN permet de définir le nombre de lignes de tableau que devra occuper la cellule. - WIDTH=taille
<table border=1 cellpadding=3 cellspacing=1>
<tr>
<td colspan=3>J'occupe les 3 colonnes.</td>
</tr>
<tr>
<td width=70 rowspan=2>Sur deux lignes</td>
<td>Cellule simple</td>
<td>Cellule simple</td>
</tr>
<tr>
<td>Cellule simple</td>
<td>Cellule simple</td>
</tr>
</table>
Résultat :
| J'occupe les 3 colonnes. | ||
| Sur deux lignes | Cellule simple | Cellule simple |
| Cellule simple | Cellule simple | |
- <TH>
- Les balises <TH> et </TH> peuvent être utilisées pour délimiter les cellules de la première ligne ou de la première colonne d'un tableau. Ces cellules sont alors considérées comme des titres de colonnes ou de lignes.
Quelques liens qui en disent plus :
http://www.lissaexplains.com/french/table.html
http://webby.free.fr/html/tableaux.html
http://webghusse.free.fr/cours_html/xhtml/tab.html
Il en manque
Les tableaux c'est pas trop mon fort...[Chesse]
Mais si tu veux tu peux m'envoyer ce qui manque, je le rajouterais au post [Cool]
je vais ajouter quelques liens sur le sujets...
C'est encore la chieuse ... dis j'ai un soucis qui est apparu comme ca et je comprends pas pourquoi. Si tu regardes ds ma colonne de droite, mes liens apparaissent centrés et avec une puce devant et pas la meme police ni la meme taille. Le truc c que je ne sais pas ou changer ca ?? ou d'ou ca vient ?
C'est pas pressé mais si un de ces jours ta 2 minutes tu peux jeter un coup d'oeil STP ??
Merci
Jess [Pfff] qui croyait se demerder mais en fait NON
Bon, les tableaux c'est super. Mais est-ce qu'on peut mettre des maintenant ? J'ai l'impression quand même qu'on n'a pas assez la main sur le code pour pouvoir mettre des CSS (enfin en tout cas pas des CSS externes).
Sinon, je suis tombé là (presque) par hasard, et je trouve que c'est cool que des blogs existent comme celui-là, pour aider tous les néophytes.
Bonne continuation !
[Vite]
Ah super, j'ai réussi à faire un beau petit tableau grâce à toi [Super]
URL pour faire un rétrolien vers ce message :
http://www.canalblog.com/cf/fe/tb/?bid=251752&pid=6131190
Liens vers des weblogs qui référencent ce message :
Haut de Page
Des articles
Des commentaires
Il manque certaines balises utiles : tu n'as pas parlé par exemple du titre d'un tableau avec la balise [caption], ou encore qu'on peut bien séparer l'en-tête, le corps et le pied du tableau avec les balises [thead], [tbody] et [tfoot].
Et l'un des attributs les plus utilisés aussi :
border-collapse:collapse;
Je l'utilise dans la quasi-totalité de mes tableaux.
Sinon c'est vraiment parfait, on peut faire un zouli tableau très facilement comme ça. [Moqueur]