Les listes - Training on line


	• Tableaux à angles arrondis • Créer une barre de scroll colorée • Les Roll-Over • Créer un calque • Créer un tableau • Créer un calque • Créer un tableau • Créer un calque • Créer un tableau • Créer un calque • Créer un poulet • Créer un calque • Créer un tableau • Créer un formu


	• Monter une page • Déplacer une image • Manipuler un calque

Les listes ordonnées

Les listes non ordonnées

Les listes avec définition

Combinaison de listes

Les puces personnalisées

1. Les listes ordonnées

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 élément de la liste.

Exemple :

<OL>
<LI>Introduction
<LI>Développement
<LI>Conclusion
<LI>Référence
</OL>

Introduction
Développemnt
Conclusion
Référence

Il faut savoir que vous pouvez ajuster l'espace après le numéro ainsi que la distance entre la mlarge gauche et les puces.
Il faut pour cela utiliser un style CSS; voir la rubrique "style CSS"

Les autres attributs de 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 : n étant la valeur de départ du marqueur.

Exple : Liste en chiffres Romains débutant à 3.

<OL TYPE=I START=3>
<LI>Elément 1
<LI>Elément 2
<LI>Elémént 3
</OL>

Elément 1
Elément 2
Elément 3

2. Les listes non ordonnées

Une liste non ordonnée s'obtient avec la balise <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 élément de la liste.

<UL>
<LI>Elément 1
<LI>Elément 2
<LI>Elément 3
</UL>

Elément 1
Elément 2
Elément 3

3. Les listes avec définition

Vous pouvez créer une liste de terme avec à l'intérieur, les définitions . Cela peut s'avérer utile pour le sommaire d'un rapport ou pour structurer un plan.
Cette liste s'obtient avec la balise <DL> accompagné des balises <DT> (le terme)et <DD> (la définition du terme).

<DL>
<DT>Partie 1
<DD>Introduction
<DD>Développement
<DD>Développemnt2
<DT>Partie 2
<DD>Introduction
<DD>Développemnt
<DT>Conclusion
<DD>Développement
<DD>Bibliographie
<DD>Remerciement
</DL>

Partie 1: Introduction; Développement; Développement 2
Partie 2: Introduction; Développement
Conclusion: Développement; Bibliographie; Remerciement

4. Combinaison de listes.

Il est possible de combiner plusieurs types de listes :

Exple : Liste non ordonnée avec liste ordonnée

Premier point
Second point
- Sous rubrique 1
- Sous rubrique 2
Troisième point

Voici le code :

<OL TYPE=A>
<LI>Premier point
<LI>Second point
<UL>
<LI>Sous rubrique 1
<LI>Sous rubrique 2
</UL>
<LI>Troisième point
</OL>

5. Créer vos propres puces.

Vous pouvez remplacer l'attribut <LI> par la balise <IMG> en définissant votre image comme un simple fichier gif.
Ne pas oublier d'insérer un retour à la ligne après chaque ligne.

Si votre fichier s'appelle "puce.gif" ;

<UL>
<IMG SRC="img/puce.gif" BORDER="0" WIDTH="8" HEIGHT="11">C'est quand même
<IMG SRC="img/puce.gif" BORDER="0" WIDTH="8" HEIGHT="11">plus sympa
<IMG SRC="img/puce.gif" BORDER="0" WIDTH="8" HEIGHT="11">avec vos propres images!!
</UL>


	Recherche par mots-clés :


	• Les feuilles de style • Les popups • Des liens spéciaux


	• Test HTML • Test DHTML • Test Javascript


	• Scripts dhtml


	• Lien n°1