list-style-type |
Type de la liste de style |
|---|---|
| CSS |
Syntaxe
| list-style-type: paramètres; |
Paramètres
| Paramètre | Description | |
|---|---|---|
| paramètres | Ce paramètre de propriété permet d'indiquer le type de liste : | |
| Valeur | Description | |
| armenian | Cette valeur permet d'indiquer un format de points de liste de nombres Arménien traditionnel. | |
| circle | Cette valeur permet d'indiquer un format de points de liste en cercle | |
| cjk-ideographic | Cette valeur permet d'indiquer un format de points de liste de nombres idéographique. | |
| decimal | Cette valeur permet d'indiquer un format de points de liste d'ordre décimal (1, 2, 3, 4,...). | |
| decimal-leading-zero | Cette valeur permet d'indiquer un format de points de liste d'ordre décimal avec des zéros pour composé pour les chiffres manquants (01, 02, 03, 04,...). | |
| disc | Cette valeur permet d'indiquer un format de points de liste en disque | |
| georgian | Cette valeur permet d'indiquer un format de points de liste de nombres Georgien traditionnel (an,ban, gan,...). | |
| hebrew | Cette valeur permet d'indiquer un format de points de liste de nombres hébreux traditionnel. | |
| hiragana | Cette valeur permet d'indiquer une liste d'ordre hiragana en minuscule (a, i, u, e, o, ka, ki,...). | |
| hiragana-iroha | Cette valeur permet d'indiquer une liste d'ordre hiragana-iroha en minuscule (i, ro, ha, ni, ho, he, to,...). | |
| katakana | Cette valeur permet d'indiquer une liste d'ordre katakana en majuscule (A, I, U, E, O, KA, KI,...). | |
| katakana-iroha | Cette valeur permet d'indiquer une liste d'ordre katakana-iroha en majuscule (I, RO, HA, NI, HO, HE, TO,...). | |
| lower-alpha | Cette valeur permet d'indiquer une liste d'ordre alphabétique en minuscule (a, b, c, d,...). | |
| lower-greek | Cette valeur permet d'indiquer une liste d'ordre grecque en minuscule (alpha, beta, gamma,...). | |
| lower-latin | Cette valeur permet d'indiquer une liste d'ordre latin en minuscule (a, b, c, d,...). | |
| lower-roman | Cette valeur permet d'indiquer une liste d'ordre numérique en chiffre roman en minuscule (i, ii, iii, iv,...). | |
| none | Cette valeur permet d'indiquer qu'il n'y a pas de point pour la liste. | |
| square | Cette valeur permet d'indiquer un format de points de liste en carré | |
| upper-roman | Cette valeur permet d'indiquer une liste d'ordre numérique en chiffre roman en majuscule (I, II, III, IV,...). | |
| upper-alpha | Cette valeur permet d'indiquer une liste d'ordre alphabétique en majuscule (A, B, C, D,...). | |
| upper-latin | Cette valeur permet d'indiquer une liste d'ordre latin en majuscule (A, B, C, D,...). | |
| ... | ... | |
Description
Cette propriété permet de fixer les attributs (numéro, puce, carré,...) de la liste.
Remarques
- Contrôle du style des listes : La propriété list-style-type permet de spécifier le style des marqueurs pour les listes à puces (ul) et numérotées (ol). Par exemple, pour une liste ordonnée, vous pouvez utiliser decimal, lower-roman, ou upper-alpha. Cela offre une grande flexibilité pour adapter les listes à des contextes esthétiques ou culturels spécifiques.
- Compatibilité avec différents types de listes : Bien que principalement utilisée pour les éléments de liste (<li>), list-style-type peut également être appliquée à des éléments conteneurs comme <ul> ou <ol>, affectant ainsi tous les éléments enfants. Cela simplifie la gestion des styles lorsqu'une liste contient de nombreux éléments.
- Options personnalisées pour les puces : Vous pouvez définir des styles de puces visuellement différents, comme square (carré), circle (cercle) ou disc (disque). Cela permet de différencier visuellement les niveaux de hiérarchie dans les listes imbriquées ou d'ajouter une touche de créativité.
- Utilisation dans les contextes multilingues : list-style-type propose des valeurs spécifiques aux cultures, telles que kannada, georgian, ou japanese-formal. Ces styles sont utiles pour créer des documents ou des interfaces respectant les conventions linguistiques et culturelles locales.
- Personnalisation des listes ordonnées : Pour les listes numérotées, list-style-type peut changer la numérotation en utilisant des systèmes comme les chiffres romains (upper-roman), l'alphabet (lower-alpha), ou des formats spécifiques comme decimal-leading-zero, ajoutant un zéro devant les nombres inférieurs à 10.
- Valeur none pour masquer les marqueurs : L'utilisation de list-style-type: none; supprime les marqueurs (puces ou numérotation) tout en conservant l'espacement par défaut des listes. C'est pratique pour styliser entièrement la liste à l'aide d'éléments graphiques ou de styles personnalisés.
- Impact sur l'accessibilité : Lorsque vous choisissez une valeur pour list-style-type, il est important de garder à l'esprit l'accessibilité. Par exemple, certains styles très inhabituels ou le choix de masquer complètement les marqueurs peuvent rendre difficile la compréhension des listes pour les utilisateurs d'aides techniques.
- Héritage de la propriété : Bien que la propriété list-style-type ne soit pas héritée par défaut, elle peut être appliquée à l'aide de la valeur inherit pour forcer un style de liste spécifique à être repris par les éléments enfants. Cela peut être utile pour uniformiser le style des listes dans une hiérarchie complexe.
Dernière mise à jour : Dimanche, le 20 décembre 2015