CSS - extensão da fonte

Descrição

A propriedade font-stretch torna os caracteres de texto mais largos ou mais estreitos do que a largura padrão dos caracteres da fonte.

Valores possíveis

ultra-condensed - Os caracteres de texto no elemento serão extremamente reduzidos.
extra-condensed - Os caracteres de texto no elemento serão reduzidos significativamente.
condensed - Os caracteres de texto no elemento serão reduzidos, mais do que se o valor fosse semicondensado.
semi-condensed - Os caracteres de texto no elemento serão ligeiramente estreitados, tornando-os mais estreitos do que se o valor fosse normal.
normal - Os caracteres de texto no elemento têm largura normal.
semi-expanded - Os caracteres de texto no elemento serão ligeiramente alargados, tornando-os mais largos do que se o valor fosse normal.
expanded - Os caracteres de texto no elemento serão alargados, tornando-os mais largos do que se o valor fosse semi-expandido.
extra-expanded - Os caracteres de texto no elemento serão bastante alargados, tornando-os mais largos do que se o valor fosse expandido.
ultra-expanded - Os caracteres de texto no elemento serão extremamente alargados, tornando-os mais largos do que se o valor fosse extra-expandido.
wider - A largura dos caracteres de texto no elemento será maior do que a do elemento pai.
narrower - A largura dos caracteres de texto no elemento será mais estreita do que no elemento pai.

Aplica-se a

Todos os elementos HTML.

Sintaxe DOM

object.style.fontStretch = "expanded";

Exemplo

Aqui está o exemplo usando esta propriedade -

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

Isso produzirá o seguinte resultado -

↰ Previous page