Chapitre 4

Les listes.

Liste ordonnée

Liste non ordonnée

Liste menu

Liste avec définition

Combiner les types de listes

Créer vos propres puces

Liste ordonnée.

Une liste ordonnée s'obtient avec la commande <OL> qui permet d'avoir une liste numérotée qui s'incrémente automatiquement. La balise <OL> est définie avec <LI> qui représente un item.

Exemple d'une liste ordonnée avec 3 items.
<OL> 
 Titre 
 <LI>item 1 
 <LI>item 2 
 <LI>item 3 
 </OL>
Titre

item 1

item 2

item 3
Les autres attributs pour la balise <OL>

TYPE=A : Marqueurs en majuscules.

TYPE=a : Marqueurs en minuscules.

TYPE=I : Marqueurs en chiffres romains (majuscules).

TYPE=i : Marqueurs en chiffres romains (minuscules).

TYPE=1 : Marqueurs en nombres (choix par défaut).

START=n : Valeur de départ du marqueur.

Exemple d'une liste en chiffres romains (majuscules) démarrant au chiffre 2.
<OL TYPE=I START=2> 
 <LI>item 1 
 <LI>item 2 
 <LI>item 3 
 </OL> 
item 1

item 2

item 3
Liste non ordonnée.

Une liste non ordonnée s'obtient avec la commande <UL> qui permet d'avoir une liste précédée d'une puce.La balise <UL> est définie avec <LI> qui représente un item. La balise <LH> indique le titre de la liste.

Exemple d'une liste non ordonnée avec 3 items.
<UL> 
 <LH>Titre 
 <LI>item 1 
 <LI>item 2 
 <LI>item 3 
 </UL> 
item 1

item 2

item 3
Les autres attributs pour la balise <UL>

COMPACT : Spécifie une liste compacte.

TYPE=DISC : Puce en forme de disque plein (valable que sous netscape).

TYPE=CIRCLE : Puce en forme de disque vide (valable que sous netscape).

TYPE=SQUARE : Puce en forme de carré (valable que sous netscape).

Exemple d'une liste compacte, avec des puces en forme de disque vide (valable que sous netscape).
<UL COMPACT TYPE=CIRCLE> 
 <LI>item 1 
 <LI>item 2 
 <LI>item 3 
 </UL> 
item 1

item 2

item 3
Liste menu.

La balise <MENU> permet d'avoir une liste menu. A noter que la balise <MENU> n'a que l'attribut COMPACT.

Exemple d'une liste menu avec 3 items.
<MENU> 
 <LI>item 1 
 <LI>item 2 
 <LI>item 3 
 </MENU> 
item 1

item 2

item 3

Liste avec définition.

Une liste de termes et de définitions correspondantes s'obtient avec la balise <DL> qui est accompagnée des balises <DT> et <DD>. <DT> représente le terme et <DD> la définition du terme. A noter que la balise <DL> n'a que l'attribut COMPACT.

Exemple d'une liste de définition avec 1 terme et 3 définitions de 3 termes.
<DL> 
 <DT>Terme 
 <DD>def 1 
 <DD>def 2 
 <DD>def 3 
 </DL> 
Terme

def 1

def 2

def3
Combiner les types de listes.

Vous pouvez bien entendu combiner plusieurs listes.

Exemple d'une liste combinant une liste ordonnée avec une liste de définition.
<OL TYPE=I> 
 <LI>item 1 
 <DL> 
 <DT>Terme 
 <DD>def 1 
 </DL> 
 </OL>
item 1

Terme

def 1
Créer vos propres puces.

Deux solutions s'offrent à vous pour créer vos propres puces
1- Soit vous passez par l'attribut SRC="puces.gif" si par exemple le fichier graphique de vos puces personnalisées se nomme puces.gif, mais cet attribut est spécifique à I.Explorer.
2- Soit vous remplacez l'attribut la balise <LI> par la balise <IMG> en définissant votre image comme un simple fichier gif.
Cette solution est la meilleure car elle est valable pour tous les navigateurs, attention de faire un break (<BR>) après chaque ligne.

Exemple d'une liste non ordonnée avec un fichier gif.

<UL>
<IMG SRC="gif/image1.gif" BORDER=0 WIDTH=16 HEIGHT=16>Personnalisez
<BR>
<IMG SRC="gif/image1.gif" BORDER=0 WIDTH=16 HEIGHT=16>vos puces !!
</UL>