|

Les tableaux (page1) : Balises

Thème

Réalisation de tableaux HTML.
Utilisés sans bordure (bordure invisible), les tableaux sont aussi souvent utilisés pour :

• mettre en page des éléments (texte, images, champs d'un formulaire...)
• faire du multicolonne
• créer une "image multipart" (mosaïque) avec des zones changeant d'aspect lorsque la souris passe dessus
• placer une trame colorée derrière du texte
• etc...

Balises

• Début tableau :

  <table bgcolor="couleur fond" align="LEFT,RIGHT,CENTER" width="pixels ou %"
  cellspacing="larg.bords" cellpadding="détach.texte" border="larg.ombrage">

• Début ligne :

  <tr bgcolor="couleur" align="LEFT,RIGHT,CENTER" valign="TOP,MIDDLE,BOTTOM,BASELINE"
  width="pixels ou %">

  Cellule titre :

  <th bgcolor="couleur" align="LEFT,RIGHT,CENTER" valign="TOP,MIDDLE,BOTTOM,BASELINE"
  width="pixels ou %" rowspan="nb.lignes" colspan="nb.col.">
  contenu cellule
  </th>

  Cellule normale :

  <td bgcolor="couleur" align="LEFT,RIGHT,CENTER" valign="TOP,MIDDLE,BOTTOM,BASELINE"
  width="pixels ou %" rowspan="nb.lignes" colspan="nb.col.">
  contenu cellule
  </td>

  Fin de la ligne :

  </tr>

• Fin du tableau :

  </table>

• On peut aussi définir une légende associée au tableau :

  <caption align="TOP,BOTTOM">texte légende</caption>

• On peut éventuellement définir des lignes d'en-tête (répétées au haut de chaque page imprimées) :

  <thead align="LEFT,CENTER,RIGHT,JUSTIFY,CHAR" char="car" charoff="longueur"
  valign="TOP,MIDDLE,BOTTOM,BASELINE">
  une ou plusieurs lignes <tr>...</tr>
  </thead>

  des lignes de corps du tableau :

  <tbody align="LEFT,CENTER,RIGHT,JUSTIFY,CHAR" char="car" charoff="longueur"
  valign="TOP,MIDDLE,BOTTOM,BASELINE">
  une ou plusieurs lignes <tr>...</tr>
  </tbody>

  et des lignes de pied du tableau :

  <tfoot align="LEFT,CENTER,RIGHT,JUSTIFY,CHAR" char="car" charoff="longueur"
  valign="TOP,MIDDLE,BOTTOM,BASELINE">
  une ou plusieurs lignes <tr>...</tr>
  </tfoot>

|