CSS - estiramiento de fuente

Descripción

La propiedad font-stretch hace que los caracteres de texto sean más anchos o más estrechos que el ancho de carácter predeterminado de font.

Valores posibles

ultra-condensed - Los caracteres de texto del elemento se reducirán extremadamente.
extra-condensed - Los caracteres de texto en el elemento se reducirán significativamente.
condensed - Los caracteres de texto del elemento se reducirán, más que si el valor estuviera semicondensado.
semi-condensed - Los caracteres de texto del elemento se reducirán ligeramente, haciéndolos más estrechos que si el valor fuera normal.
normal - Los caracteres de texto del elemento son de ancho normal.
semi-expanded - Los caracteres de texto del elemento se ensancharán ligeramente, haciéndolos más anchos que si el valor fuera normal.
expanded - Los caracteres de texto en el elemento se ampliarán, haciéndolos más anchos que si el valor fuera semiexpandido.
extra-expanded - Los caracteres de texto del elemento se ampliarán mucho, haciéndolos más anchos que si el valor se expandiera.
ultra-expanded - Los caracteres de texto en el elemento se ensancharán extremadamente, haciéndolos más anchos que si el valor fuera extra-expandido.
wider - El ancho de los caracteres de texto en el elemento será más ancho que el de su elemento padre.
narrower - El ancho de los caracteres de texto en el elemento será más estrecho que el de su elemento padre.

Se aplica a

Todos los elementos HTML.

Sintaxis DOM

object.style.fontStretch = "expanded";

Ejemplo

Aquí está el ejemplo que usa esta propiedad:

<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>

Esto producirá el siguiente resultado:

↰ Previous page