Comment changer la couleur d'une puce sans changer celle du texte ?

Bonjour/Bonsoir !

Je débute en CSS3, suivant le tutoriel de Mathieu Nebra. Après plusieurs recherches qui ne donnent pas de résultats, j'aimerais exposer mes problèmes ici .

Oui, mes problèmes. J'en ai deux, et j'aimerais que vous m'aidiez, s'il vous plaît, à les résoudre. Voici le premier :

J'aimerais modifier la couleur d'une puce (square, disc, ... qu'on définit dans list-style-type) sans modifier celle du texte dans la liste. J'ai bel et bien trouvé des solutions, mais c'est de la bricolage ; j'aimerais trouver une solution dédiée à ce problème.

Et voici le second problème :

Comment laisser la puce d'une liste dans la position par défaut (tout à gauche) mais décaler le texte de la liste (par exemple : tout à droite) ?


J'espère que vous avez compris, sinon n'hésitez pas à me poser des questions pour plus de détails. Cordialement,

Triskelleton
Modifié par Triskelleton (06 Jul 2017 - 21:54)

Bonjour,

Un truc du genre ?

ul {
  list-style-type: none;
  width: 200px;
}
ul li:before {
  content: "\2022";
  float: left;
  color: tomato;
}
ul li {
  text-align: right;
}