
Kits graphiques
Kits graphiquesWordPress Themes
Joomla Templates
Drupal Templates
CRE Loaded Templates
osCommerce Templates
Magento Themes
ZenCart Templates
OpenCart Templates
VirtueMart Templates
Shopify Themes
WooCommerce Themes
Prestashop Themes
jigoShop Themes
Kit graphique Flash
Kit graphique SWiSH
Ressources Informatique
Actualité informatiqueAstuces Windows
Astuces internet explorer
Dictionnaire informatique
Dossiers
Tutoriaux


Les types de listes en html
(X)HTML / CSS - 28 Aug 2005 - j0n3sou comment énumérer certains points...
Le langage HTML offre la possibilité de réaliser 3 types de listes : à puces, ordonées ou "glossaire". Nous allons étudier chacune d'entre elles...
1) Listes à puces
Ces lites sont ordonnées via des puces de formes géométriques : circulaires (pleines ou vides) ou carrées.
Le code HTML est le suivant :

<ul>
<li>Elément 1</li>
<li>Elément 2</li>
<li>Elément 3</li>
</ul>
<li>Elément 1</li>
<li>Elément 2</li>
<li>Elément 3</li>
</ul>
Par défaut, les puces sont pleines et circulaires (disc). Pour définir un style de puce, il faut utiliser l'attribut type dans <ul> avec pour valeur :
- disc : circulaires et pleines (défaut)
- circle : circulaires et vides
- square : carrées et pleines

Notez que <ul> et </ul> peuvent être remplacés par <menu> et </menu>.
2) Listes ordonées
Ce type de liste permet d'énumérer des éléments avec des chiffres ou letres par ordre alphabétique.
Le code HTML est le suivant :

<ol>
<li>Elément 1</li>
<li>Elément 2</li>
<li>Elément 3</li>
</ol>
<li>Elément 1</li>
<li>Elément 2</li>
<li>Elément 3</li>
</ol>
Il existe 5 types de "puces" dans ce cas qui se définissent aussi via l'attribut type dans la balise <ol> :
- 1 : liste de chiffres arabes (1,2,3...) (défaut)
- i : liste de chiffres romains minuscules (i, ii, iii...)
- I : liste de chiffres romains majuscules (I, II, III...)
- a : liste de lettres minuscules (a, b, c...)
- A : liste de lettres majuscules (A, B, C...)
A cela s'ajoute l'attribut start dans la balise <ol> qui permet de définir un chiffre à partir du quel commencer. Par exemple start="3" a été utilisé pour les exemples ci dessus.
3) Listes "Glossaire"
Les lites "glossaire" comme je les appelle permettent de définir un mot par exemple.
Le code HTML est le suivant :

<dl>
<dt>Mot 1</dt>
<dd>Une définition du mot 1...</dd>
<dt>Mot 2</dt>
<dd>Une définition du mot 2...</dd>
<dd>sur plusieurs lignes !</dt>
</dl>
<dt>Mot 1</dt>
<dd>Une définition du mot 1...</dd>
<dt>Mot 2</dt>
<dd>Une définition du mot 2...</dd>
<dd>sur plusieurs lignes !</dt>
</dl>

Aucun attribut particulier...
Précédent : FTP : les CHMODSuivant : Méthodes de formulaire
6.4 /10 (1145 votes)
Commentaires
Aucun commentaire !
Postez un commentaire !
Vous devez être inscrit(e) et connecté(e) pour ajouter un article !