BORDURE D'UN TABLEAU

  Syntaxe : <table border=4 cellspacing=1>
Sans borderAvec borderborder=4 border=3 cellspacing=0.5
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2

 DIMENSIONS D'UN TABLEAU

  Syntaxe pour des dimensions relatives :
  <table width=50% > : Containt le tableau à occuper 50% de la largeur de la fenêtre.
  <table height=10% > : Containt le tableau à occuper 10% de la hauteur de la fenêtre.
Tableau avec width=75% et height=10%

  Syntaxe pour des dimensions absolues :
  <table width=500  > : Containt le tableau à une largeur de 500 pixels.
  <table height=10 > : Containt le tableau à une hauteur de 10 pixels.
Tableau avec width=500 pixels et height=10 pixels

  La même syntaxe s'applique pour dimensionner des cellules :
<td width / height=n% / pixel > </td>
Largeur de 90% Reste
A1B1
A2B2
Hauteur de 50 pixels
A1

  Syntaxe pour espacer le texte du bord des cellules : Cela dispose aussi le texte voir : Alignement
  <table cellpadding=20 > : place 20 pixels entre le bord de la cellule et le texte.
Tableau avec 20 pixels entre le texte et le bord des cellules

 COULEUR D'UN TABLEAU

  Fond et quadrillage : <table border bgcolor="yellow" bordercolor="green" >
  Pour une cellule seulement : dans le tag cellule <td bgcolor=yellow>Contenu cellule</td>
  Ombrages :<table border bodercolordark=green bordercolorlight=yellow >
bgcolor="red"bordercolor="blue" avec
<td bgcolor="yellow"</td>
bgcolor=yellow
bordercolor=green
bordercolordark=green
bordercolorlight=yellow
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2
A1 B1 C1
A2 B2 C2

 ALIGNEMENT DANS UN TABLEAU

  Syntaxe pour disposer le texte dans sa cellule :
  <table border>
  <tr>
  <td align="center"> Centre le texte </td>
  <td align="right"> Aligne le texte à droite </td>
  <td align="right" valign="bottom"> Aligne le texte à droite et en bas </td>
  </tr></table>
Les valeurs pour ALIGN sont : "LEFT" (par défaut), "CENTER", "RIGHT"
Les valeurs pour VALIGN sont : "TOP", "MIDDLE" (par défaut), "BOTTOM"
Texte centré Texte aligné à droite Texte à droite et en bas
<table border> 
<tr>
<td align="center"></td>
</tr></table>             
<table border>
<tr>
<td align="right"></td>
</tr></table>             
<table border> 
<tr><td align=right
        valign="bottom"></td> 
</tr></table>             
Texte au centre
Texte à droite
Texte à droite et en bas

Voici ce que donne <table border align="center">
Tableau dont on ne peut prédire la position avec certitude !!
En effet bien que certains navigateurs le centre avec cette méthode
ce sont les objets du tableau qui sont attendus au centre.

Par contre ce tableau <center><table>...</table></center> est un objet centré de la page, il est bien au centre.

Ce tableau est un objet de la page
et c'est la page qui centre :
Il est au centre

On peut vérifier ce qui précède en plaçant notre tableau dans un tableau dont on centre les éléments :
<TABLE WIDTH=100%> <TR> <TD ALIGN=CENTER>
    <table border> <tr>
    <td>Tableau centré par un tableau</td> </tr>
    </table>
</TD> </TR></TABLE>
Tableau centré par un tableau

  Syntaxe pour espacer le texte du bord les cellules : Cela dimensionne aussi la cellule voir : Dimension
  <table cellpadding=20 > : place 20 pixels entre le bord de la cellule et le texte.
Tableau avec 20 pixels entre le texte et le bord des cellules

 LEGENDE AUTOUR D'UN TABLEAU

  Syntaxe pour une en-tête :
  <table>
  <caption valign=top>Titre du tableau</caption> C'est la valeur par défaut
  <tr> <td> A1 </td> ... </tr> ... </table>
C1
Titre d'un tableau
A1B1D1

  Syntaxe pour un pied :
  <table>
  <caption valign=bottom align=right>Légende du tableau</caption>
  <tr> <td> A1 </td> ... </tr> ... </table>
C1
Légende du tableau
A1B1D1

  Syntaxe pour un texte à côté : Attention DÉLICAT !!
  <table align=left> (Le tableau est à gauche donc le texte sera à droite ! )
  <tr> <td> A1 </td> ... </tr> ... </table>
  </table> Texte que l'on veut mettre à côté du tableau <br clear=all>
C1
A1B1D1
Texte à droite du tableau

 FUSION DES CELLULES

  Syntaxe pour fusionner des cellules :
  <table border> <tr>
  <td colspan=3> Fusionne 3 colonnes </td>
  <td rowspan=2> Fusionne 2 lignes </td>
  </tr></table>
Fusion de 3 colonnes Fusion de 2 lignes
<table border> 
<tr> <td colspan=3> </td> </tr>
<tr> <td>A1</td> <td>B1</td> <td>C1</td> </tr>
<tr> <td>A2</td> <td>B2</td> <td>C2</td> </tr>
</table>
<table border>
<tr> <td rowspan=3> </td> </tr>
<tr> <td>A1</td> </tr>
<tr> <td>A2</td> </tr>
</table>             
Fusion de 3 colonnes
A1B1C1
A2B2C2
Fusion de 2 lignes
(parfois : rowspan=2+1)
A1
A2
SOMMAIRE      Retour à définir tableau    Synthèse