Text-emphasis-style - Propriété CSS

Schéma de la syntaxe de text-emphasis-style.

Description des termes utilisés sur le schéma :

• char est un caractère à utiliser à la place des styles prédéfinis, à indiquer entre apostrophes ou guillemets.

Description de la propriété text-emphasis-style.

text-emphasis-style définit le caractère ou la forme géométrique qui sera utilisé comme marque de mise en exergue. Voici par exemple un texte mis en exergue avec des marques du type circle.

Texte mis en exergue avec des cercles

Pour une présentation plus détaillée de la mise en exergue reportez-vous à la propriété raccourcie text-emphasis.

Valeurs pour text-emphasis-style.

• text-emphasis-style: none;

  Aucun caractère d'accentuation. C'est la valeur par défaut.

• text-emphasis-style: dot; text-emphasis-style: circle; text-emphasis-style: double-circle; text-emphasis-style: triangle; text-emphasis-style: sesame;

  Définit une forme géométrique prédéfinie pour les marques d'accentuation.

  Exemple
  ( dot )

  Exemple
  ( circle )

  Exemple
  ( double-circle )

  Exemple
  ( triangle )

  Exemple
  ( sesame )
• text-emphasis-style: 'V';

  Définit un caractère particulier qui sera utilisé comme caractère d'accentuation. Le caractère doit être inscrit entre apostrophes ou guillemets, afin de le distinguer des valeurs prédéfinies.

  Exemple
  ( un caractère )
• text-emphasis-style: open dot; text-emphasis-style: filled dot;

  Ces deux valeurs peuvent être combinées avec n'importe laquelle des autres valeurs, sauf avec none. Elles définissent, pour filled une marque pleine, et pour open une marque vide (contour seul). Lorsque aucune de ces deux valeurs n'est précisée, la marque est considérée comme pleine par défaut. Si l'une de ces deux valeurs est précisée seule, la marque par défaut est circle pour les écritures horizontales, et sesame pour les écritures verticales (CJK, hébreu...).
  Voyez les exemples ci-dessous :

  Exemple
  ( filled )

  Exemple
  ( open )

  Exemple
  ( open dot )

  Exemple
  ( open triangle )
• text-emphasis-style: initial; (none) text-emphasis-style: inherit; text-emphasis-style: revert; text-emphasis-style: revertLayer; text-emphasis-style: unset;

  Consultez les pages suivantes pour plus de détails : initial, inherit, revert, revert-layer, unset.

Exemple d'animation de text-emphasis-style.

L'animation de la propriété text-emphasis-style parcourt quelques unes des valeurs acceptées par cette propriété. Les options filled et open ont également été incluses dans l'animation.

Exemple interactif avec la propriété text-emphasis-style.

Compatibilité des navigateurs avec text-emphasis-style.

Remarques :

(1) Avec le préfixe du navigateur -webkit-.

1

Mise en emphase
du texte

2

Propriété
text-emphasis-style

Estimation de la prise en charge globale.

95%

96%

Navigateurs sur ordinateurs :

Navigateurs sur mobiles :

Navigateurs obsolètes ou marginaux :

Internet Explorer

UC Browser pour Androïd

Opéra Mobile

QQ Browser

1

Baidu Browser

1

Opéra

Samsung Internet

Chrome

Safari

Firefox

Safari sur IOS

Edge

Androïd Brower

Firefox pour Androïd

Chrome pour Androïd

KaiOS Browser

Opéra mini

Voir le site Caniuse.com pour plus d'informations de compatibilité.

Caniuse

Caniuse

Histoire de la propriété text-emphasis-style.

• Module CSS - Décoration du texte - Niveau 3

  Première présentation de la propriété text-emphasis-style.
  

  27 Janvier 1999

  Document de travail.

  

  01 Août 2013

  Candidat à la recommandation.

  

  

• Module CSS - Décoration du texte - Niveau 4

  Pas de changement concernant la définition de la propriété text-emphasis-style.
  

  13 Mars 2018

  Document de travail.

  

  

  

Voir aussi, au sujet des décorations de texte.

Les spécifications CSS éditées par le W3C sont organisées en modules. La propriété text-emphasis-style fait partie du module CSS Text Decoration Module. Les définitions suivantes sont également décrites dans ce module.

Propriétés :