Dans la section <HEAD>, il y a les définitions générales de la page. Dans la section <BODY>, il y a le contenu de la page elle-même.

Par exemple, on peut y définir le titre de la page, qui sera affichée en haut de la fenêtre du navigateur

<HTML>
  <HEAD>
    <TITLE>
      Les chats
    </TITLE>
  </HEAD>
  <BODY>
  </BODY>
</HTML>

Commentaires

Il est possible d'insérer à tout endroit de la page, des commentaires, comme ceci :

<HTML>
  <HEAD>

    <TITLE>
      Les chats
    </TITLE>
  </HEAD>
  <BODY>
  </BODY>
</HTML>

Ces commentaires n'apparaîtront que dans le "source" de la page. Jamais dans l'affichage de la page elle-même.

Il est possible d'ajouter des paramètres aux balises. Par exemple, voici comment préciser que la page que vous rédigez est en français :

Pour afficher du texte, il suffit de l'écrire dans la section <BODY>

<HTML>
  <BODY>
   Les chats sont de sympathiques animaux
  </BODY>
</HTML>

Plus petit ou plus grand : <BIG> et <SMALL)

Normal<BIG>Gros</BIG>Normal
Normal<SMALL>petit</SMALL>Normal
Normal<BIG><BIG>Très gros</BIG></BIG>Normal

Résultat :

NormalGrosNormal NormalpetitNormal NormalTrès grosNormal

Attention à l'empilement des <BIG><BIG><BIG>... ! Les navigateurs vont se comporter très différements. Internet explorer va sans doute limiter le nombre de grossissements possibles (Même un empilement de 8 ou 9 BIG n'augmenteront pas énormément la taille des caractères. Google Chrome va un peu plus grossir, et FireFox va carrément écrire du texte énorme.

Gras, Italique, Souligné, Barré, ... Clignotant

La balise <CITE> donne le même résultat que <I>. Peut-être est-ce une manière de rendre plus "légale" une citation, sans parler de mise en forme ?

Normal
<B>Gras</B>
<I>Italique</I>
<U>Souligné</U>
<S>Barré</S>
Normal
<STRIKE>Barré aussi</STRIKE>

Résultat :

Normal Gras Italique Souligné ~~Barré~~ Normal ~~Barré aussi~~

On peut utiliser, à titre anecdotique, la baliste <BLINK>, pour faire clignoter du texte, mais mes tests montrent que ça ne fonctionne qu'avec FireFox !

Exposants et indices : <SUP> et <SUB>

C'est le 1<SUP>er</SUP> prix :
Le symbole chimique de l'eau : H<SUB>2</SUB>O

Résultat :

C'est le 1^er prix : Le symbole chimique de l'eau : H₂O

Ecartement fixe : <TT>, <CODE>

Au lieu d'utiliser une police telle que Courier New, on peut utiliser la balise <TT>. Si le visiteur n'a pas de police Courier New, <TT> se débrouillera sans. Ainsi, par exemple, si j'écris "WWW", ça prendra le même espace que si j'écris "iii"

texte normal
<TT>texte a écartement fixe</TT>
texte normal

Résultat :

texte normal texte a écartement fixe texte normal

On peut obtenir le même résultat en utilisant la balise <CODE>, qui est censée mettre en évidence les lignes de programmation d'exemple :

En Visual basic, on peut écrire:
<CODE>Msgbox "Bonjour"</CODE>

Résultat :

En Visual basic, on peut écrire: Msgbox "Bonjour"

Couleurs (Théorie)

Les navigateurs peuvent montrer jusqu'à 16 millions de couleurs, mais tout va dépendre des capacités de la carte graphique et de l'écran des visiteurs. Au maximim, donc, exactement 16'777'216 couleurs.

La mélange des couleurs est assez compliqué à comprendre en soi. Pour simplifier, disons que nous vivons dans un mond en noir et blanc. Le noir serait la couleur la plus sombre (0) et le blanc la plus claire (disons 100). En informatique, ça ne va pas de 0 à 100, mais de 0 à 255. 0 est donc noir et 255 est donc blanc. 255 variations possibles, + le 0, ça nous fait 256 couleurs.

Ensuite, nous n'allons pas compter en décimal, mais en hexadécimal. C'est à dire qu'on ne va pas compter : 0,1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18, 19, 20, ... mais comme ceci :

0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F,10,11,12,13,14,15,16,17,18,19,1A,1B,1C, etc. Vous voyez le principe ? C'est à dire que 10 en hexadécimal, c'est 16 en décimal.

Ce qui fait que si on comptait jusqu'à 255, en décimal, ça ferait : 250,251,252,253,254 et 255. Mais en hexadécimal, ça ferait : FB, FC,FD,FE et FF.

Pour reprendre notre histoire d'écran en noir et blanc, le noir serait toujours 0, et le blanc : FF.

Mais comme nous travaillons en couleur, nous devons préciser la valeur des trois couleurs primaires (Non pas Rouge, jaune et bleu) mais ROUGE, VERT et BLEU.

Nous allons avoir 2 chiffres pour le rouge, 2 chiffres pour le vert, et 2 chiffres pour le bleu. 0 deviendrait par exemple 00. Admettons par exemple qu'on veuille une couleur rouge vif (C'est à dire du rouge à fond (c'est à dire FF), et rien du tout comme vert ni comme bleu (00 à chaque fois, nous aurions un code couleur : FF0000.

Ce qui nous donne un total de 256 variations de rouge X 256 de vert X 256 de bleu = 16'777'216 très exactement.

Imaginons une teinte avec un petit peu de rouge (15 par exemple), très peu de vert (03 par exemple), et presque un max de bleu (E9 par exemple), ça donnerait : 1503E9. Pour préciser cléairement qu'il s'agit d'un nombre hexadécimal, on fait précéder ce "nombre à 6 chiffres" d'un dièse : #1503E9.

Si vous prenez un piceau réel et que vous mélangez du rouge, du vert et du bleu, vous allez avoir une sorte de marron pas beau. C'est parce qu'il s'agit de réelle peinture. On dit que ce sont des "couleurs soustractives". Comme nous parlons d'écrans et de pixels qui s'illuminent, nous allons parler de "Couleurs additives". Ainsi, si vous essayez d'imaginer ce que cserait une couleur composée d'un maximin de rouge, de vert et de bleu (#FFFFFF donc), vous obtiendrez... du blanc ! Si si ! Sans rire ! tandis qu'à l'inverse, si vous imaginez une couleur avec aucun rouge ni bleu ni vert (#000000), vous aurez du ... Noir... Alors que dans le cas du peintre, s'il ne trempe son pinceau dans aucun pot de peinture, sa toile restera ... blanche. (D'ou les termes additif et soustractif).

Couleur de texte : <BODY TEXT="#000000">, <FONT COLOR="#000000">

<BODY TEXT="#CC0000">
  texte en couleur définie par BODY
  <FONT COLOR="#009900">
    texte en couleur spécifique
  </FONT>
  texte en couleur définie par BODY
</BODY>

Résultat (Pour une page web composée uniquement de ce code HTML):

texte en couleur définie par BODY texte en couleur spécifique texte en couleur définie par BODY

Couleurs de texte : couleurs textuelles

Normal
<FONT COLOR="DarkOliveGreen">
texte en vert olive foncé
</FONT>
Normal

Résultat :

Normal texte en vert olive foncé Normal

Texte défilant (de droite à gauche)

texte fixe
<MARQUEE>
Ce texte défile
</MARQUEE>
texte fixe

Résultat (Il y a un passage à la ligne automatique en cas de <MARQUEE>, contrairement aux autres balises) :

texte fixe Ce texte défile texte fixe

Fond de couleur et ralentissement

Il est possible de définir un fond de couleur pour ce texte, ainsi qu'un "delay" de ralentissement, en millisecondes. Ici, "200" donne un défilement assez lent. Par contre "1" ne donne pas une vitesse foudroyante (Un peu comme si on n'introiduisait pas de paramètre):

<MARQUEE BGCOLOR="yellow" SCROLLDELAY="200">
Ce texte défile en jaune, assez lentement
</MARQUEE>

Résultat :

Ce texte défile en jaune, assez lentement

Paragraphes <P>

On encadre les paragraphes avec la balise <P>

<BODY>
  <P>
    Paragraphe 1
  </P>
  <P>
    Paragraphe 2
  </P>
</BODY>

Résultat :

Paragraphe 1

Paragraphe 2

Comme la balise <P> indique un nouveau paragraphe, dans l'absolu, on pourrait écrire ceci qui serait équivalent :

<BODY>
  Paragraphe 1
  <P>
    Paragraphe 2
  </P>
</BODY>

Alignements de paragraphes (Gauche, droite, centré, justifié)

<P ALIGN="Left">
Aligné à gauche (par défaut)
</P>
<P ALIGN="Right">
Aligné à droite
</P>
<P ALIGN="Center"></P>
Centré
</P>
<P ALIGN="Justify">
Pour bien comprendre l'alignement à gauche et à droite, il est nécessaire d'avoir une grande phrase à écrire. et, selon la largeur
de la fenêtre du navigateur, si elle est suffisamment étroite pour que pèlusieurs lignes soient nécessaires, alors, vous verrez enfin l'alignement
de ce paragraphe sur plusieurs lignes, à la fois à gauche et à droite (Justifié, donc).
</P>

Résultat :

Aligné à gauche (par défaut)

Aligné à droite

Centré

Pour bien comprendre l'alignement à gauche et à droite, il est nécessaire d'avoir une grande phrase à écrire. et, selon la largeur de la fenêtre du navigateur, si elle est suffisamment étroite pour que pèlusieurs lignes soient nécessaires, alors, vous verrez enfin l'alignement de ce paragraphe sur plusieurs lignes, à la fois à gauche et à droite (Justifié, donc).

Sauts de ligne <BR>

La balise <BR> est une des rares balises a ne pas nécessiter de balise de fin </BR>. Un peu comme si on insérait un "caractère spécial de saut de ligne". On reste doinc dans le même paragraphe, mais ave un espacement interligne au lieu d'un grand espacement interparagraphe :

<P>
  Premier paragraphe, première ligne
  <BR>
  Premier paragraphe, deuxième ligne
</P>
<P>
  Deuxième paragraphe, première ligne
  <BR>
  Deuxième paragraphe, deuxième ligne
</P>

Résultat :

Premier paragraphe, première ligne
Premier paragraphe, deuxième ligne

Deuxième paragraphe, première ligne
Deuxième paragraphe, deuxième ligne

A l'inverse, empêcher une portion de texte de se couper : NOBR

Le texte en majuscule ne sera jamais coupé, même si ça doit dépasser la largeur de l'écran :

Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte <nobr>CECI DOIT APPARAITRE SUR UNE SEULE LIGNE COUTE QUE COUTE</nobr> Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte

Essayez de redimensionner la fenêtere de votre navigateur pour vous en rendre compte :

Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte CECI DOIT APPARAITRE SUR UNE SEULE LIGNE COUTE QUE COUTE Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte Mon texte

Mise en retrait de paragraphes <BLOCKQUOTE>

Avant
<BLOCKQUOTE>
  Ce paragraphe est un peu en retrait par rapport aux autres paragraphes. C'est non seuleemnt la premiuère   ligne du texte, mais également toutes
  les autres qui sont en retrait, comme vous pouvez le voir ici-même.
  <BLOCKQUOTE>
    Rien n'interdit d'imbriquer les BLOCKQUOTES
    <P>
      Sur même plusieurs paragraphes, comme ceci.
    </P>
  </BLOCKQUOTE>
</BLOCKQUOTE>
Après

Résultat :

Avant

Ce paragraphe est un peu en retrait par rapport aux autres paragraphes. C'est non seuleemnt la premiuère ligne du texte, mais également toutes les autres qui sont en retrait, comme vous pouvez le voir ici-même.
Rien n'interdit d'imbriquer les BLOCKQUOTES
Sur même plusieurs paragraphes, comme ceci.

Après

Mise en forme code source HTML respectée <PRE>

La balise <PRE> permet de demander à ce que soit respectée la mise en forme du texte dans la partie source HTML, comme ceci :

<PRE>
un
deux
</PRE>
quatre
cinq

Résultat

un
  deux

quatre cinq

Titres <H1>, <H2>, <H3>, <H4>, <H5>, <H6>

Les balises de titres permettent de hiérarchiser un document complexe.

<H1>Voici le titre 1</H1>
<H2>Voici le titre 2</H2>
<H3>Voici le titre 3</H3>
<H4>Voici le titre 4</H4>
<H5>Voici le titre 5</H5>
<H6>Voici le titre 6</H6>

Résultat :

Voici le titre 1

Voici le titre 2

Voici le titre 3

Voici le titre 4

Voici le titre 5

Voici le titre 6

Les titres, comme les paragraphes, peuvent s'aligner à la demande :

<H1 Align="Center">Voici le titre 1</H1>
<H2 Align="Right">Voici le titre 2</H2>

Résultat :

Voici le titre 1

Voici le titre 2

Les couleurs ne sont apparemment pas permises. De toute façon, si on ajoute un paramètre non reconnu, le navigateur l'ignore sans faire d'erreur :

<H4 Banane="Jaune" Align="Center" BGColor="#FF0000">Voici le titre 4</H4>

Résultat :

Voici le titre 1

Ce qui est troublant, c'est que DreamWeaver affiche bien un fond rouge (DreamWeaver est l'éditeur HTML que j'utilise avant de publier mes pages web), mais aucun des navigateurs ne le fait, par contre.

Listes <LI>, <UL>

La balise <LI> n'exige pas de balise de fermeture.

<UL> délimite les éléments de la liste :

Commissions
<UL>
  <LI>Abricots
  <LI>Beurre
  <LI>Cacahuètes
</UL>
Bonnes courses !

Résultat :

Commissions

Abricots
Beurre
Cacahuètes

Bonnes courses !

Il semble que les options de type de puces, telles que "Square" ou "Disc" ne fonctionnent PAS dans s ne fonctionnant pas, ou mal dans Internet Explorer. L'exemple suivant donne toujours des petits ronds noirs :

<UL Type="Square">
<LI>Abricots
<LI>Beurre
</UL>

Résultat (Nul dans Internet Explorer, donc) :

Abricots
Beurre

Images

Insertion d'une image se trouvant dans le même dossier que le fichier HTML qui l'appelle :

<img src="verredevin.jpg">

Insertion d'une image se trouvant dans le dossier "armoire" qui se trouve lui-même dans le dossier ou se trouve la page HTML qui l'appelle

Insertion d'une image se trouvant dans le "dossier père" du dossier qui contient la page HTML qui l'appelle

On remonte de deux dossiers plus en amont, et, depuis là, on va chercher l'image dans le dossier tiroir qui se trouve dans armoire

Insertion d'une image qui se trouve dans le chemin absolu :

Rien n'empêche d'insérer une image qui se trouve sur un autre site ! ... Nous ne parlons pas de l'aspect légal, mais technique ! Evidemment, si l'auteur de l'autre site renomme ou retire l'image, votre page html sera pourvue d'une référence à une image invalide.

Alignement du texte à côté de l'image

Le passage à la ligne avec <BR> est important, car on ne peut pas avoir plusieurs images sur la même ligne avec des alignements différents

<img src="verredevin.jpg" Align=Middle>
Au milieu <br>
<img src="verredevin.jpg" Align=Top>
Au dessus <br>
<img src="verredevin.jpg" Align=Bottom> En dessous

Résultat :

Au milieu
Au dessus
En dessous

Ce qui est troublant, c'est que le paramètre Align permet également la valeur Left et Right, ce qui permet logiquement de placer une image à gauche ou à droite de la page.

Mais le souci est qu'on ne peut pas faire cohabiter un alignement vertical et horizontal !

Ceci ne fonctionne pas :

Et ceci non plus :

Placement de texte entre deux images

Nous allons utiliser le paramètre Align à gauche et à droite, comme ceci :

Redimensionnement (Paramètres Width - Hauteur - et Height - Largeur - )

Redimensionnement de la largeur seulement. Dans ce cas, la hauteur sera automatiquement adaptée pour conserver les proportions :

Résultat :

On peut évidemment procéder de la même manière avec la hauteur

Résultat :

Si on ne précise ni la largeur, ni la hauteur, l'image garde ses dimensions originales, mais si on précise les deux, alors, il est possible de déformer l'image :

Résultat :

Bordures d'image (Paramètre Border)

Résultat :

Espacement autour de l'image (Paramètres HSpace et VSpace

HSpace détermine un espace à gauche ET à droite de l'image (Impossible de faire l'un sans l'autre). Même chose pour VSpace. L'unité est le pixel

Avant<br>
Gauche
<img src="verredevin.jpg" Align=Middle Border=1 HSpace=40 VSpace=50>
Droite<br>
Après

Résultat :

Avant
Gauche Droite
Après

Texte de remplacement (Paramètre Alt)

Certains internaute désactivent l'affichage de simages pour accélérer le chargement. Dansd'autres cas, une image peut avoir un nom ou un emplacement erroné. Dans ces cas de figure, il peut être intéressant d'afficher un texte de substitution avec Alt

Dans notre cas, il y a un "s" de trop a "verredevin". Donc l'image n'existe pas, le texte de remplacement est affiché.

Résultat

Un verre de vin

Par contre, les navigateurs affichent la chose différemment :

Comme on le voit, il y en a pour tous les goûts ! :-)

Lignes de séparation

<HR> Tout simple :

<HR NoShade> :

Mise en page globale

Marges (LeftMargin, TopMargin)

Ce sont des paramètres définis avec la balise <BODY>.

<BODY>
Mon texte
</BODY>

Va afficher Mon Texte avec une petite marge raisonnable en haut et à gauche. Si on désire que le texte soit complètement collé au bord de la page :

<BODY LeftMargin=0 TopMargin=0>
Mon texte
</BODY>

L'unité est spécifiée en pixels.

On peut également spécifier une marge droite, et les 100 pixels de cet exemple se comptent à partir de la droite de la page :

Il existe même un paramètre BottomMargin, mais je ne comprends pas son intérêt.

Couleurs de texte et de fond (Balise <BODY>, paramètre BGColor, Text)

Code couleur hexadécimale :

<BODY bgcolor="#006600" text="#00CCFF">
ceci est un texte
</BODY>

Ou, évidemment, le nom de la couleur :

Voir dans la section "Liens utiles" en bas de cette page, un lien vers le nom des couleurs

Image de fond

Il suffit de donner le chemin et l'image :

Tableaux

A la base un tableau se délimite avec la balise <TABLE>. Mais cette balise seule n'affiche rien :

Avant le tableau
<TABLE>
</TABLE>
Après le tableau

Résultat (Vide donc):

Avant le tableau

Après le tableau

Maintenant, il s'agit d'y installer au moins une cellule :

<TABLE>
<td> Je suis dans une cellule</td>
</TABLE>

Résultat (On ne voit pas le contour du tableau, car la bordure est transparente) :

Je suis dans une cellule

La même chose, avec une bordure de tableau :

<TABLE Border="1">
<td>Tableau visible</td>
</TABLE>

Résultat :

Tableau visible

Créons maintenant un tableau composé de deux cellules horizontales :

<TABLE Border="1" >
<TD>Ligne 1, colonne 1</TD>
<TD>Ligne 1, colonne 2</TD>
</TABLE>

Résultat :

Ligne 1, colonne 1 Ligne 1, colonne 2

Pour obtenir une deuxième ligne, il faut utiliser la balise <TR>. L'exemple suivant n'affiche rien, car la balise <TD> est indispensable :

<TABLE Border="1" >
<TR>Ligne 1, colonne 1</TR>
<TR> Ligne 2, colonne 1</TR>
</TABLE>

Résultat (Vide) :

Ligne 1, colonne 1 Ligne 2, colonne 1

Ce code affiche effectivement la première cellule, puis un passage à une nouvelle ligne <TR>, et une 2ème cellule :

<TABLE Border="1" >
  <TD>Ligne 1, colonne 1</TD>
  <TR>
  <TD>Ligne 2, colonne 1</TD>
</TABLE>

Résultat :

Ligne 1, colonne 1
Ligne 2, colonne 1

Dans l'exemple suivant, nous avons deux cellules pour la première ligne, mais seulement une pour la 2ème. Du coup, la dernière cellule en bas à droite est "inutilisable"

<TABLE Border="1" >
  <TD>Ligne 1, colonne 1</TD>
  <TD>Ligne 1, colonne 2</TD>
  <TR>
  <TD>Ligne 2, colonne 1</TD>
</TABLE>

Résultat :

Ligne 1, colonne 1 Ligne 1, colonne 2
Ligne 2, colonne 1

Une autre manière d'écrire consiste à encadrer les lignes des balises <TR>, comme ceci :

<TABLE Border="1" >
  <TR>
    <TD>Ligne 1, colonne 1</TD>
    <TD>Ligne 1, colonne 2</TD>
  </TR>
  <TR>
    <TD>Ligne 2, colonne 1</TD>
    <TD>Ligne 2, colonne 2</TD>
  </TR>
</TABLE>

Résultat (Cette fois, nous exploitons la dernière cellule) :

Ligne 1, colonne 1 Ligne 1, colonne 2

Ligne 2, colonne 1 Ligne 2, colonne 2

Fusion de cellules (Balise <TD>, paramètre Colspan)

Il est possible de fusionner des cellules. Dans l'exemple qui suit, nous auront 2 cellules dans la première ligne, et une seule cellule dans la 2ème, mais grâce à ColSpan, cette cellule s'étendra sur 2 cellules.

<TABLE Border="1" >
  <TR>
    <TD>Ligne 1, colonne 1</TD>
    <TD>Ligne 1, colonne 2</TD>
  </TR>
  <TR>
    <TD ColSpan="2">Ligne 2, colonne 1 et 2 fusionnées</TD>
  </TR>
</TABLE>

Résultat :

Ligne 1, colonne 1 Ligne 1, colonne 2

Ligne 2, colonne 1 et 2 fusionnées

Si on avait indiqué ColSpan="3", alors que seules 2 cellules horizontales existent, il n'y aurait eu aucune différence d'affichage, et aucune erreur.

Fusion de cellules verticales (Balise <TD>, Paramètre RowSpan

Tout a fait logiquement, c'est le paramètre RowSpan qui s'occupe de ça :

<TABLE Border="1" >
  <TR>
    <TD>Ligne 1, colonne 1</TD>
  <TD>Ligne 1, colonne 2</TD>
  </TR>
  <TR>
    <TD RowSpan="2">Ligne 2 et 3 fusionnées, colonne 1</TD>
    <TD>Ligne 2, colonne 2</TD>
  </TR>
  <TR>
    <TD>Ligne 3, colonne 2</TD>
  </TR>
</TABLE>

Résultat :

Ligne 1, colonne 1 Ligne 1, colonne 2

Ligne 2 et 3 fusionnées, colonne 1 Ligne 2, colonne 2

Ligne 3, colonne 2

Couleurs de fond (Balise <BGColor>, applicable aux tableaux, lignes et cellules)

Les couleurs de fond peuvent être "surchargées", comme ceci :

<TABLE BGColor="Bisque" Border="1" >
<TR BGColor="Coral">
<TD>Couleur de la ligne : Coral (Orange)</TD>
<TD>Couleur de la ligne : Coral (Orange)</TD>
</TR>
<TR>
<TD>Couleur globale du tableau : Bisque (rose pâle)</TD>
<TD BGColor="Gold">Couleur de la cellule : Gold (Jaune)</TD>
</TR>
</TABLE>

Le système de surcharge des couleurs s'applique exactement de la même manière pour les images de fond.

<TABLE Border="1" background="fond1.jpg">
  <TR background="fond2.jpg">
    <TD>Image de la ligne : fond2</TD>
    <TD>Image de la ligne : fond2</TD>
  </TR>
  <TR>
    <TD>Image globale du tableau : fond1</TD>
    <TD background="fond3.jpg">Image de la cellule : fond3</TD>
  </TR>
</TABLE>

On s'attend à ce que la première ligne soit en "Fond 2" (Balise TR), la première cellule de la 2ème ligne en Fond 1, et la dernière cellule en Fond 3. Ca, c'est si vous utilisez Firefox ou Chrome. Or, si vous utilisez internet Explorer, la première ligne est en fait en Fond 2, ce qui veut dire qu'Internet Explorer ne reconnait étrangement pas le paramètre BackGround de la balise <TR>. Ce qui est d'autant plus étrange qu'il reconnaissait le paramètre BGColor de cette balise <TR>.

Il faut d'abord indiquer, au niveau de la balise <TABLE>, l'épaisseur de bordure. Ensuite, on parle de couleur.

<TABLE Border="1" BorderColor="#FF0000">
  <TR>
    <TD>Un </TD>
    <TD>Deux</TD>
  </TR>
  <TR>
    <TD>Trois</TD>
    <TD>Quatre</TD>
  </TR>
</TABLE>

Dans IE et Chrome, toutes les cellules sont encadrées de rouges, mais dans FireFox, seul tout le tableau en globalité est encadré de rouge (Ce qui me parait nettement plus logique)

Dans l'exemple suivant, on s'attend à ce que les lignes elles-mêmes soient encadrées de rouge (#FF0000) et de bleu en dessous (#FF0000). Mais ici encore, que de problèmes : Chrome et IE comprennent correctement (Encore qu'ils encadrent toutes les cellules au lieu d'ancadrer la ligne globalement), et FireFox ne comprend carrément pas : aucune couleur ! :

<TABLE Border="1">
  <TR BorderColor="#FF0000">
    <TD>Un </TD>
    <TD>Deux</TD>
  </TR>
  <TR BorderColor="#0000FF"">
    <TD>Trois</TD>
    <TD>Quatre</TD>
  </TR>
</TABLE>

<TABLE Border="1">
<TR>
<TD BorderColor="#FF0000">Un </TD>
<TD BorderColor="#0000FF">Deux</TD>
</TR>
<TR>
<TD BorderColor="#00CC00">Trois</TD>
<TD BorderColor="#FF66CC">Quatre</TD>
</TR>
</TABLE>

HTML

Afin de mieux vous rendre compte des effets des différentes balises, je vous conseille de visualiser cette page avec les principaux navigateurs du marché (notamment Firefox et Internet Eplorer)

Les exemples présentés dans cette page ont été vérifiés avec Internet Explorer 8, FireFox 3 et Google Chrome 2

Voir également la section CSS

Gras, Italique, Souligné, Barré, ... Clignotant

Exposants et indices : <SUP> et <SUB>

Ecartement fixe : <TT>, <CODE>

Voici le titre 1

Voici le titre 2

Voici le titre 3

Voici le titre 4

Voici le titre 5

Voici le titre 6

Voici le titre 1

Voici le titre 2

Voici le titre 1

Autres italiques : <CITE>, <DFN>

Ligne 1, colonne 1	Ligne 1, colonne 2
Ligne 2, colonne 1	Ligne 2, colonne 2

Ligne 1, colonne 1	Ligne 1, colonne 2
Ligne 2, colonne 1 et 2 fusionnées

Ligne 1, colonne 1	Ligne 1, colonne 2
Ligne 2 et 3 fusionnées, colonne 1	Ligne 2, colonne 2
Ligne 2 et 3 fusionnées, colonne 1	Ligne 3, colonne 2

Couleur de la ligne : Coral (Orange)	Couleur de la ligne : Coral (Orange)
Couleur globale du tableau : Bisque (rose pâle)	Couleur de la cellule : Gold (Jaune)

Image de la ligne : fond2	Image de la ligne : fond2
Image globale du tableau : fond1	Image de la cellule : fond3

Un	Deux
Trois	Quatre

Un	Deux
Trois	Quatre

Un	Deux
Trois	Quatre