Comentarios al ejercicio Citas de Virgilio (Web Fonts)

Cabecera

En la cabecera <head> de la página hay que:

Etiquetas

Al desactivar la hoja de estilo se puede identificar las siguientes etiquetas:

Al volver a aplicar la hoja de estilo no se identifican más etiquetas, pero puesto que los párrafos no son todos iguales, es que hay varias clases de párrafos <p>.

Clases

En total, se necesitan tres clases de párrafo <p>:

Los tipos de letra son también diferentes en cada una de estas clases.

Fuentes

En este ejercicio se utilizará la regla-arroba @font-face, para enlazar las siguientes fuentes en nuestro propio ordenador:

Para facilitar la realización del ejercicio, en el archivo de plantilla comprimido se han incluido las fuentes en formato woff y en formato woff2, pero como esas fuentes están disponibles en Google Fonts, se recomienda al alumno que las descargue por su cuenta para comprobar que sabe hacerlo.

Se han incluido los formatos woff y woff2 para que compruebe la diferencia de tamaño. También puede comprobar que el formato woff2 no funciona en Internet Explorer 11.

Estilos

Al restablecer el estilo se pueden identificar las propiedades utilizadas:

Solución del ejercicio

El código HTML del ejercicio puede consultarse abriendo la página web del ejercicio Citas de Virgilio (Web Fonts) y abriendo el código fuente (Ctrl+U).

La hoja de estilo del ejercicio puede consultarse abriendo este enlace a la hoja de estilo del ejercicio Citas de Virgilio (Web Fonts).

Tenga en cuenta que en estos ejercicios hay a menudo varias maneras de conseguir lo mismo, por lo que la solución no es nunca única.