Comment puis-je créer des listes ordonnées avec une numération alphabétique minuscule et des parenthèses droites à l'aide de CSS ?

Création de listes ordonnées avec des parenthèses alpha inférieures et droites

Le style de liste ordonnée par défaut pour la numération alpha inférieure utilise des points. Cependant, est-il possible de modifier ce style et d'utiliser des parenthèses droites à la place ?

Personnalisation des styles de liste ordonnée

À l'aide de compteurs CSS, nous pouvons établir des styles de liste personnalisés. Voici comment obtenir le résultat souhaité :

ol {
  counter-reset: list;
}

ol > li {
  list-style: none;
}

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

Pour démontrer cette solution :

<span>Custom List Style Type (v1):</span>
<ol>
  <li>Number 1</li>
  <li>Number 2</li>
  <li>Number 3</li>
  <li>Number 4</li>
  <li>Number 5</li>
  <li>Number 6</li>
</ol>

Ce style personnalisé affichera désormais les éléments de liste ordonnés avec une numérotation alpha inférieure suivie d'un droit parenthèse :

a) Numéro 1
b) Numéro 2
c) Numéro 3
d) Numéro 4
e) Numéro 5
f) Numéro 6

Notez que vous devrez peut-être ajuster le rembourrage ou d'autres aspects de style pour répondre à vos besoins spécifiques.

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!