CSS3 - Fuentes web

Las fuentes web se utilizan para permitir las fuentes en CSS, que no están instaladas en el sistema local.

Diferentes formatos de fuentes web

No Señor.	Fuente y descripción
1	TrueType Fonts (TTF) TrueType es un estándar de fuentes de contorno desarrollado por Apple y Microsoft a fines de la década de 1980. Se convirtió en las fuentes más comunes para los sistemas operativos Windows y MAC.
2	OpenType Fonts (OTF) OpenType es un formato para fuentes de computadora escalables y desarrollado por Microsoft
3	The Web Open Font Format (WOFF) WOFF se utiliza para desarrollar una página web y se desarrolló en el año de 2009. Ahora se utiliza por recomendación del W3C.
4	SVG Fonts/Shapes SVG permite fuentes SVG dentro de la documentación SVG. También podemos aplicar CSS a SVG con la propiedad de tipo de letra.
5	Embedded OpenType Fonts (EOT) EOT se utiliza para desarrollar las páginas web y se ha integrado en las páginas web, por lo que no es necesario permitir fuentes de terceros.

El siguiente código muestra el código de muestra de la fuente:

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

Producirá el siguiente resultado:

Descripción de las fuentes

La siguiente lista contiene todas las descripciones de las fuentes que se colocan en la regla @ font-face:

No Señor.	Valor y descripción
1	font-family Se utiliza para definir el nombre de la fuente.
2	src Se usa para definir la URL
3	font-stretch Se usa para encontrar cómo se debe estirar la fuente
4	font-style Se utiliza para definir el estilo de las fuentes.
5	font-weight Se usa para definir el peso de la fuente (negrita)