7. Lignes horizontales

Pour créer des lignes en HTML, la commande de base est:

<HR> donne:


Pour faire varier la largeur de la ligne, on utilise le code suivant: <HR WIDTH=75%> . Cela donne une ligne de 75% de la largeur de l'écran (selon la largeur de la fenêtre choisie par l'usager).


Toutes les valeurs sont possibles, même les décimales. Voici un échantillon varié:

<HR WIDTH=5%>donne:

<HR WIDTH=15%>donne:

<HR WIDTH=25%>donne:

<HR WIDTH=50%>donne:

<HR WIDTH=65%>donne:

<HR WIDTH=92%>donne:

Les paramètres de largeur des lignes peuvent aussi être désignées en pixels. Ainsi:

<HR WIDTH=100> donne:

<HR WIDTH=200> donne:

<HR WIDTH=300> donne:

<HR WIDTH=400> donne:

Pour faire varier l'épaisseur de la ligne:
<HR SIZE="5"> donne une ligne d'épaisseur 5:


Toutes les valeurs sont possibles, même les décimales. Voici un échantillon varié:

<HR SIZE="1">donne:

<HR SIZE="2">donne:

<HR SIZE="3">donne:

<HR SIZE="3.5">donne:

<HR SIZE="4">donne:

<HR SIZE="10">donne:

<HR SIZE="25">donne:

On peut faire varier les deux en même temps:


Toutes les valeurs sont possibles, même les décimales. Voici un échantillon varié:

<HR SIZE=2 WIDTH=25%> donne:

<HR SIZE=4 WIDTH=45%> donne:

<HR SIZE=10 WIDTH=95%>donne:

<HR SIZE=20 WIDTH=25%>donne:

Les lignes peuvent aussi être alignées à gauche à droite ou centrées. Les commandes suivantes
<HR ALIGN=left>
<HR ALIGN=right>
<HR ALIGN=center>
donnent respectivement:







Enfin, la commande <HR NOSHADE> permet d'afficher une ligne sans effet de profondeur comme ci-dessous:

Images et lignes

Il est également intéressant de placer des lignes en tant qu'images, ce qui offre beaucoup plus de possibilités graphiques. Ainsi, il s'agit de dessiner et préparer à l'avance dans votre logiciel de dessin préféré une image en forme de ligne et de l'enregistrer en format GIF. On peut aussi capturer un fond d'écran et utiliser la trame sous forme de ligne mince ou épaisse, longue ou courte, selon votre choix. Ces images sont alors appelées à l'aide de la commande de base (<img src="images/ligne1.gif">). Ainsi, on pourrait avoir des lignes de ce genre:

Chapitre suivant
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20
Retour à la page principale