Actividad 1: Modifica el formato de los enlaces
Profesor: Javier López
Volver
Descargar fichero HTML base
Actividad 1
Actividad 2
Resultado final
Solucionador

Actividad 1: Modifica el formato de los enlaces
Al contrario de lo que pasaba en la breve actividad del tema anterior, en éste existen dos actividades. Esta primera es extensa y por lo tanto se divide en diferentes fases y la segunda actividad breve pero básica para el resto de temas.

Todas las fases de esta primera actividad hacen referencia a la maquetación de los enlaces, que están dentro de una lista no ordenada (<ul>).

Así, dentro del fichero estilos.css debes añadir el código CSS correspondiente para:

  1. Eliminar las viñetas (círculos) que aparecen por defecto delante de cada enlace.
  2. Colocar todos los enlaces (<li>) en la misma línea.
  3. Dejar espacio a los lados de cada enlace (para que respiren un poco).
  4. Centrar horizontalmente cada enlace dentro de su espacio interno.
  5. Eliminar la sangría o margen izquierdo que aparece por defecto al crear una lista.

Después de conseguir los puntos anteriores:

  1. Cambiar el color por defecto de los enlaces (define un color, por ejemplo naranja).
  2. Eliminar el subrayado que aparece por defecto de los enlaces.
  3. Definimos un tamaño algo mayor (20px).
  4. Al pasar el cursor por encima el color de los enlaces cambia a blanco.

Por último, debes maquetar el primer elemento de la lista "¿Quiénes somos?" para que no funcione como enlace (ya que el html que estamos creando 'index.html' ya es el apartado de "¿Quiénes somos?), de tal manera que:

  1. El color inicial de este primer elemento sea de un color diferente (por ejemplo 'silver').
  2. El tamaño debe ser el mismo que los otros dos elementos (20px).
  3. Al pasar el cursor por encima no debe aparece el cursor 'de la mano' (pointer).