añadir la etiqueta <metaname="viewport" ... > necesaria en dispositivos móviles
añadir la etiqueta <link rel="stylesheet" ... > de enlace a la hoja de estilo
Etiquetas
Al desactivar la hoja de estilo se puede identificar las siguientes etiquetas:
una etiqueta de sección <h1> para el título.
varias etiquetas de párrafo <p>, una para cada refrán.
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 seis clases de párrafo, una para cada párrafo.
clases a, b, c, d, e y f: cada una con unos bordes distintos
Fuentes
En este ejercicio se utiliza el tipo de letra genérico sans-serif.
Tamaños
Los anchos de los bordes son 5px, 10px, 20px o 40px.
Estilos
Al restablecer el estilo se pueden identificar las propiedades utilizadas:
Página (body):
tipo de letra: font-family
tamaño de letra: font-size
Título (h1):
borde: border
alineación: text-align
mayúsculas: text-transform
Párrafos (p):
margen inferior: margin-bottom
alineación: text-align Estrechando la ventana de manera que los refranes ocupen varias líneas podemos deducir la alineación del texto.