CSS3 - Fontes da Web

As fontes da Web são usadas para permitir as fontes em CSS, que não são instaladas no sistema local.

Diferentes formatos de fontes da web

Sr. Não. Fonte e descrição
1

TrueType Fonts (TTF)

TrueType é um padrão de fonte de contorno desenvolvido pela Apple e Microsoft no final dos anos 1980. Tornou-se as fontes mais comuns para sistemas operacionais Windows e MAC.

2

OpenType Fonts (OTF)

OpenType é um formato para fontes de computador escalonáveis ​​e desenvolvido pela Microsoft

3

The Web Open Font Format (WOFF)

WOFF é usado para desenvolver página web e desenvolvido no ano de 2009. Agora ele está usando por recomendação W3C.

4

SVG Fonts/Shapes

SVG permite fontes SVG na documentação SVG. Também podemos aplicar CSS a SVG com propriedade de face de fonte.

5

Embedded OpenType Fonts (EOT)

EOT é usado para desenvolver as páginas da web e foi incorporado em páginas da web, portanto, não há necessidade de permitir fontes de terceiros

O código a seguir mostra o código de amostra da face da fonte -

<html>
   <head>
      <style>
         @font-face {
            font-family: myFirstFont;
            src: url(/css/font/SansationLight.woff);
         }
         div {
            font-family: myFirstFont;
         }
      </Style>
   </head>
   
   <body>
      <div>This is the example of font face with CSS3.</div>
      <p><b>Original Text :</b>This is the example of font face with CSS3.</p>
   </body>
</html>

Isso produzirá o seguinte resultado -

Descrição das fontes

A lista a seguir contém todas as descrições de fontes que são colocadas na regra @ font-face -

Sr. Não. Valor e descrição
1

font-family

Usado para definir o nome da fonte

2

src

Usado para definir o URL

3

font-stretch

Usado para localizar, como a fonte deve ser esticada

4

font-style

Usado para definir o estilo das fontes

5

font-weight

Usado para definir a espessura da fonte (negrito)