Color y letra

Con poca cosa nuestra web puede quedar bien bonita.

Color

Para cambiar los colores del fondo y de la letra, añadimos dos líneas al apartado "body" de nuestro documento "estilo.css".

"Background" significa fondo y el "color" es el de la letra. En nuestro ejemplo cambiaremos el color del fondo a gris platino y el de la letra a aceituna negra. Estos dos colores tienen muy buen contraste (8.77) y es algo a tener muy en cuenta para que la página sea legible. Líneas a añadir:

background: #E5E4E2;
color: #3B3C36;

Letra

Si también queremos cambiar la tipografía para que sea más redondita podemos añadir otra línea:

font-family: sans-serif;

El tipo de letra que se usa también es importante. Pero el mundo de las tipografías es muy vasto y suele ser de lo que más pesa en una web. Por ello, en esta MiniWeb se hace uso de las tipografías que tenga cada navegador por defecto.

Si hemos añadido estas líneas a nuestro "body", el "estilo.css" quedará así:

body {
  margin: 0 auto;
  max-width: 42em;
  background: #E5E4E2;
  color: #3B3C36;
  font-family: sans-serif;
  font-size: 1.4rem;
}

footer {
  text-align: center;
  font-size: 0.9em;
  border-top: 2px solid #3B3C36;
  margin-top: 1rem;
}

Para ver el resultado, hay que guardar los cambios y refrescar la página del navegador.

Continuar

Para apañar mejor nuestra paginita, podemos ponerle un menú de navegación con enlaces a los diferentes apartados que tenga.