La text-decoration-colorpropriété définit la couleur du soulignement, du surlignage ou du trait de ligne sur le texte avec la text-decorationpropriété appliquée. Il peut également définir la couleur de soulignement sur les liens.
a ( text-decoration-color: #E18728; )Valeurs
text-decoration-colorpeut inheritou accepter toute valeur de couleur CSS, y compris les couleurs nommées, les couleurs HEX, RGBa et HSLa.
Sténographie
Dans les navigateurs prenant en charge text-decoration-styleet, text-decoration-colorvous pouvez ajouter une couleur à une text-decorationpropriété abrégée:
.underlined ( text-decoration: underline dotted red; )Actuellement, seul Firefox prend en charge ce sans préfixe. Safari le prend en charge avec le -webkitpréfixe. Chrome a également besoin du -webkitpréfixe et des fonctionnalités de plate-forme Web expérimentale activées dans les indicateurs Chrome.
Démo
Le text-decoration-colordans cette démo fonctionne dans les versions actuelles de Firefox et Safari. Il fonctionnera également dans Chrome avec l'indicateur «Fonctionnalités expérimentales de la plate-forme Web» activé.
Voir le Pen text-decoration-color par CSS-Tricks (@ css-tricks) sur CodePen.
En rapport
text-decorationtext-decoration-linetext-decoration-styletext-decoration-skip
Plus d'information
text-decoration-colordans le module de décoration de texte CSS niveau 3 CRtext-decoration-colorchez MDN
Prise en charge du navigateur
| Chrome | Safari | Firefox | Opéra | C'EST À DIRE | Android | iOS |
|---|---|---|---|---|---|---|
| 31 † | 7,1 * | 6,0 ‡ | Aucun | Aucun | Aucun | 8 * |
† avec les «fonctionnalités expérimentales de la plate-forme Web» activées dans chrome: // flags. Chrome 31 a besoin du préfixe -webkit-. Nous avons testé Chrome 50 et cela ne fonctionnait que sans préfixe.
‡ 6+ avec préfixe -moz, sans préfixe à partir de 36.