text-emphasis-color

La propriété text-emphasis-color définit la couleur utilisée pour dessiner les marques d'emphase. Celle-ci peut être (re)définie grâce à la propriété raccourcie text-emphasis.

/* Valeur initiale */
text-emphasis-color: currentColor;

/* Valeur de couleur */
/* Type <color> */
text-emphasis-color: #555;
text-emphasis-color: blue;
text-emphasis-color: rgba(90, 200, 160, 0.8);
text-emphasis-color: transparent;

/* Valeurs globales */
text-emphasis-color: inherit;
text-emphasis-color: initial;
text-emphasis-color: unset;

Valeur initiale	`currentcolor`
Applicabilité	tous les éléments
Héritée	non
Média	visuel
Valeur calculée	couleur calculée
Type d'animation	une couleur
Ordre canonique	l'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

Valeurs

<color>: Définit la couleur utilisée pour les marques. Si on ne définit pas de couleur, ce sera la couleur courante du texte qui sera utilisée.

Syntaxe formelle

<color>où 
<color> = <rgb()> | <rgba()> | <hsl()> | <hsla()> | <hex-color> | <named-color> | currentcolor | <deprecated-system-color>
où 
<rgb()> = rgb( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<rgba()> = rgba( [ [ <percentage>{3} | <number>{3} ] [ / <alpha-value> ]? ] | [ [ <percentage>#{3} | <number>#{3} ] , <alpha-value>? ] )
<hsl()> = hsl( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
<hsla()> = hsla( [ <hue> <percentage> <percentage> [ / <alpha-value> ]? ] | [ <hue>, <percentage>, <percentage>, <alpha-value>? ] )
où 
<alpha-value> = <number> | <percentage>
<hue> = <number> | <angle>

Exemples

HTML

<p><em>Coucou</em>, je suis <em>là</em></p>

CSS

em {
  text-emphasis-style: sesame;
  text-emphasis-color: blue;
}

Résultat

Spécifications

Spécification	État	Commentaires
CSS Text Decoration Module Level 3 La définition de 'text-emphasis' dans cette spécification.	Candidat au statut de recommandation	Définition initiale.

Fonctionnalité	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari
Support simple	25 -webkit-	?	46 45 — 49¹	Non	15 -webkit-	Oui 6.1 -webkit-

Fonctionnalité

Chrome

Edge

Firefox

Internet Explorer

Opera

Safari

Support simple

25 -webkit-

45 — 49¹

Non

15 -webkit-

Oui

6.1 -webkit-

Fonctionnalité	Android webview	Chrome for Android	Edge mobile	Firefox for Android	Opera Android	iOS Safari	Samsung Internet
Support simple	4.4 -webkit-	?	?	46 45 — 49¹	33 -webkit-	7.1	?

Fonctionnalité

Android webview

Chrome for Android

Edge mobile

Firefox for Android

Opera Android

iOS Safari

Samsung Internet

Support simple

4.4 -webkit-

45 — 49¹

33 -webkit-

7.1

1. From version 45 until version 49 (exclusive): this feature is behind the layout.css.text-emphasis.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

	Ordinateur						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Webview Android	Chrome pour Android	Edge Mobile	Firefox pour Android	Opera pour Android	Safari pour iOS	Samsung Internet
Support simple	Support complet 25 Préfixée Support complet 25 Préfixée Préfixée Nécessite l'utilisation d'un préfixe : -webkit-	?	Support complet 46 Support complet 46 Aucun support 45 — 49 Désactivée Désactivée From version 45 until version 49 (exclusive): this feature is behind the `layout.css.text-emphasis.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Aucun support Non	Support complet 15 Préfixée Support complet 15 Préfixée Préfixée Nécessite l'utilisation d'un préfixe : -webkit-	Support complet Oui Support complet Oui Support complet 6.1 Préfixée Préfixée Nécessite l'utilisation d'un préfixe : -webkit-	Support complet 4.4 Préfixée Support complet 4.4 Préfixée Préfixée Nécessite l'utilisation d'un préfixe : -webkit-	?	?	Support complet 46 Support complet 46 Aucun support 45 — 49 Désactivée Désactivée From version 45 until version 49 (exclusive): this feature is behind the `layout.css.text-emphasis.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Support complet 33 Préfixée Support complet 33 Préfixée Préfixée Nécessite l'utilisation d'un préfixe : -webkit-	Support complet 7.1	?

Légende

Support complet: Support complet
Aucun support: Aucun support
Compatibilité inconnue: Compatibilité inconnue
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.: Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.
Cette fonctionnalité nécessite un préfixe particulier ou utilise un autre nom.: Cette fonctionnalité nécessite un préfixe particulier ou utilise un autre nom.

Voir aussi

text-emphasis-style
text-emphasis.
text-emphasis-position
Le type de données <color>
D'autres propriétés relatives aux couleurs color, background-color, border-color, outline-color, text-emphasis-color, text-shadow, caret-color et column-rule-color
Appliquer des couleurs sur des éléments HTML