CSS - font-stretch

La description

La propriété font-stretch rend les caractères du texte plus larges ou plus étroits que la largeur de caractère par défaut de la police.

Valeurs possibles

  • ultra-condensed - Les caractères de texte dans l'élément seront extrêmement réduits.

  • extra-condensed - Les caractères de texte de l'élément seront considérablement réduits.

  • condensed - Les caractères de texte dans l'élément seront rétrécis, plus que si la valeur était semi-condensée.

  • semi-condensed - Les caractères de texte de l'élément seront légèrement rétrécis, ce qui les rendra plus étroits que si la valeur était normale.

  • normal - Les caractères de texte de l'élément sont de largeur normale.

  • semi-expanded - Les caractères de texte de l'élément seront légèrement élargis, ce qui les rendra plus larges que si la valeur était normale.

  • expanded - Les caractères de texte de l'élément seront élargis, ce qui les rendra plus larges que si la valeur était semi-développée.

  • extra-expanded - Les caractères de texte de l'élément seront considérablement élargis, ce qui les rendra plus larges que si la valeur était développée.

  • ultra-expanded - Les caractères de texte de l'élément seront extrêmement élargis, ce qui les rendra plus larges que si la valeur était extra-développée.

  • wider - La largeur des caractères de texte dans l'élément sera plus large que celle de leur élément parent.

  • narrower - La largeur des caractères de texte dans l'élément sera plus étroite que celle de leur élément parent.

S'applique à

Tous les éléments HTML.

Syntaxe DOM

object.style.fontStretch = "expanded";

Exemple

Voici l'exemple utilisant cette propriété -

<html>
   <head>
   </head>

   <body>
      <p style = "font-stretch:ultra-expanded;">
         If this doesn't appear to work, it is likely that your computer 
         doesn't have a <br>condensed or expanded version of the font being used.
      </p>
   </body>
</html>

Cela produira le résultat suivant -