Comment changer la couleur de soulignement tout en conservant la même couleur du texte ?

Changer la couleur de soulignement : séparer le texte et les teintes de soulignement

Afin de conserver une couleur de texte rouge tout en changeant la couleur de soulignement en noir, commençons par explorez une solution tirant parti d'une nouvelle propriété CSS3 : text-decoration-color.

Avec cette propriété, nous pouvons attribuer des couleurs distinctes au texte lui-même et à la décoration soulignée, éliminant ainsi le besoin d'éléments wrapper supplémentaires. Voici un extrait de code mis à jour :

p {
  text-decoration: underline;
  -webkit-text-decoration-color: red; /* Safari still uses a vendor prefix */
  text-decoration-color: red;
}

<p>Black text with red underline in one element - no wrapper elements here!</p>

En tirant parti de la propriété text-decoration-color, nous pouvons obtenir l'effet souhaité consistant à avoir un texte souligné en noir sans sacrifier la couleur du texte rouge.

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!