Ecrire le HTML | A Propos | FAQ | Alumni | Kudos | Références | Tags | Leçons | précédent | suivant |

11. Listes de Définition

Encore une autre variété de

Objectifs

Après cette leçon, vous pourrez :

• Construire une liste d'éléments avec des définitions présentées sous forme de blocs de texte indentés
• créer une bibliographie à l'aide d'une liste de définition

Leçon

Note : Si vous n'avez pas les documents des leçons précédentes, téléchargez une copie maintenant.

Dans la leçon 6, nous avons vu comment créer deux types de listes : les listes ordonnées <ol>...</ol> et les listes non ordonnées <ul>...</ul>. Nous allons maintenant en présenter une autre, la liste de définition. A la différence des listes que nous avons étudiées précédemment, la liste de définition présente ses données, non pas avec une puce ou un nombre, mais à l'aide d'un format d'indentation.

Le code pour un tag de liste de définition est :

<dl>
<dt>  titre1
<dd>  définition1
<dt>  titre2
<dd>  définition2
                :
                :
                :
<dt>  titreN
<dd>  définitionN
</dl>    

Les tags <dl> .... </dl> incluent des paires alternées de titres <dt> et de définitions <dd>. Un navigateur Web génèrera automatiquement la liste de manière à indenter chaque définition par rapport au titre.

Dans un navigateur web, l'exemple ci-dessus apparaîtra comme suit :

titre1 définition1 titre2 définition2 : : titreN définitionN

La liste de définition peut être utilisée pour créer un glossaire , mais pour notre exemple, nous nous en servirons pour ajouter une petite bibliographie à notre leçon Web Volcan :

1. Ouvrez le fichier HTML, index.html dans votre éditeur de texte.
2. Après la liste non ordonnée sous le titre Références, tapez ce qui suit :

   
   <h3>Bibliographie</h3>
   Cherchez ces livres dans votre bibliothèque :
   <dl>
   <dt>Cas, R.A.F. et Wright, J. V. (1987). 
   <dd><I>Les Successions Volcaniques : Modernes et Anciennes.</I> 
   Londres : Allen &amp; Unwin.
   
   <dt>La Croix, A. (1904)
   <dd><I>La Montagne Pel&eacute;e et ses Eruptions.</I>
   Paris : Masson
   
   <dt>Lipman, P.W. et Mullineaux (eds). (1981)
   <dd><I>Les Eruptions du Mont St. Helens en 1980, Washington.</I>
   Rapport Professionnel des Etudes Géologiques U.S. 1250.
   </dl>
   

   NOTE : Nous avons utilisé quelques-uns des Caractères Spéciaux pour le symbole du Et Commercial ("&") dans la première référence et pour les e accentués dans la seconde référence. Si vous ne connaissez pas les caractères spéciaux HTML, consultez la leçon 10.

3. Sauvegardez et Rechargez dans votre navigateur web.

Vérifiez Votre Travail

Comparez votre document avec un exemple du document-type. Si votre page web est différente de l'exemple, vérifiez le texte que vous avez tapé dans l'éditeur de texte. N'oubliez pas les tags <dl>... </dl> entourant la liste. Une des erreurs courantes est d'inverser les tags <dt> et <dd>.

Révision

Revoyons les grandes lignes de cette leçon :

1. En quoi la liste de définition diffère-t-elle des listes ordonnées et non ordonnées ?
2. Dans quels cas pourriez-vous utiliser une liste de définition ?
3. Quelle est la différence entre les tags <dt> et <dd> ?

Travail Indépendant

Utilisez une liste de définition pour ajouter un glossaire ou une bibliographie à votre propre page HTML.

Informations Supplémentaires

Vous pouvez inclure d'autres listes ordonnées/non ordonnées à l'intérieur d'une liste de définition. Par exemple, supposons que nous ayons à faire une liste des principaux groupes minéraux, avec une description de leurs caractéristiques, et une sous-liste de minéraux dans chaque groupe avec leur utilisation dans la société. Nous voudrions qu'elle s'affiche de la manière suivante (seules quelques données sont présentes ici) :

Les oxydes

Combinaisons d'ions métal et d'oxygène, comprend la majorité des minerais issus d'opérations d'extraction.

• Hématite (minerai de fer)
• Magnétite (minerai de fer, minéral magnétique)
• Corindon (pierre précieuse, abrasive)

Les sulfates

Les ions métal se combinent avec l'ion sulfate (SO4), la structure atomique peut parfois permettre les liaisons avec des molécules d'eau.

• Gypse (plâtre)
• Barite (boue de forage)

Le HTML pour produire cela est le suivant :

<dl>
<dt><b>Les oxydes</b>
<dd>Combinaisons d'ions métal avec de l'oxygène, comprend la majorité des minerais issus d'opérations d'extraction.
    <ul>
    <li>Hématite (minerai de fer)
    <li>Magnétite (minerai de fer, minéral magnétique)
    <li>Corindon (pierre précieuse, abrasive)
    </ul>
<dt><b>Les sulfates</b>
<dd>Les ions métal se combinent avec l'ion sulfate (SO4), la structure atomique  peut parfois permettre les liaisons avec des molécules d'eau.
    <ul>
    <li>Gypse (plâtre)
    <li>Barite (boue de forage)
    </ul>
</dl>

A Suivre....

Ajoutez une "signature" informative avec un lien pour envoyer des emails.

ALLER A.... | Index des Leçons | précédent : "Caractères Spéciaux" | suivant : "Pieds de Page Adresses et Liens Email" |

Ecrire le HTML : Leçon 11 : Listes de Définition
©1994-2003 Maricopa Center for Learning and Instruction (MCLI)
Maricopa Community Colleges

La 'net connection (en anglais) à MCLI est Alan Levine
Suggestions en Français à Bernard Bensoussan

URL: http://www.mcli.dist.maricopa.edu/tut/tut11.html