Listes commandées dans HTML et CSS: supprimant la période

Création d'une liste commandée sans la période après les chiffres est possible à l'aide de CSS. Bien que vous puissiez supposer que ce n'est pas possible, explorons comment vous pouvez y parvenir.

pour supprimer la période, style la liste en tant que tel:

ol.custom {
  list-style-type: none;
  margin-left: 0;
}

Pour créer des numéros personnalisés, utilisez le code suivant:

ol.custom > li {
  counter-increment: customlistcounter;
}

ol.custom > li:before {
  content: counter(customlistcounter) " ";
  font-weight: bold;
  float: left;
  width: 3em;
}

Cela affichera les numéros personnalisés avant chaque élément de liste.

Gardez à l'esprit que cette solution repose sur le: avant pseudo-sélectionneur, qui peut ne pas fonctionner dans des navigateurs plus âgés comme IE6 et IE7. Pour résoudre ce problème, utilisez une règle CSS supplémentaire qui cible spécifiquement ces navigateurs:

ol.custom {
  *list-style-type: decimal; /* targets IE6 and IE7 only */
}