Comment puis-je créer une liste ordonnée HTML avec des marqueurs alpha inférieurs et des parenthèses droites ?

Listes ordonnées en HTML : alpha inférieur avec parenthèses droites

Le type de liste ordonnée standard pour "alpha inférieur" utilise un point " ". comme marqueur de liste. Existe-t-il un moyen de modifier cela pour utiliser une parenthèse droite à la place, ce qui donne une séquence comme a)... b) etc. ?

Solution

Propositions CSS une fonctionnalité appelée compteurs, qui permet la création automatique de séquences telles que des numéros de chapitre. En adaptant ce concept, nous pouvons obtenir la liste alpha inférieure souhaitée avec des parenthèses droites.

Voici un extrait de code :

ol {
  counter-reset: list;
}
ol > li {
  list-style: none;
}
ol > li:before {
  content: counter(list, lower-alpha) ") ";
  counter-increment: list;
}

La propriété "counter-reset" initialise un compteur nommé " list" pour la liste ordonnée. "style de liste : aucun ;" supprime les symboles de la liste native.

L'étape clé est le sélecteur "li:before". Il insère du contenu avant chaque élément de la liste :

• "counter(list, lower-alpha)" compte en utilisant les caractères alpha inférieurs (a), b), etc.).
• L'ajout d'une parenthèse fermante et d'un espace crée le format souhaité : a)

La liste résultante apparaîtra comme suit :

`Type de style de liste personnalisé (v1) :

1. Numéro 1

< ;li>Numéro 2

2. Numéro 3


3. Numéro 4


4. Numéro 5


5. Numéro 6

`

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!