Home | Clases | Introducción a las aplicaciones web con HTML5, CSS3 y Javascript | Práctica 3 Diseño responsive

Práctica 3 Diseño responsive


Práctica 3 Diseño responsive

  • Crea una carpeta con el nombre EjercicioNombreApellidoDNI que incluya (0,5 puntos):
    • un documento index.html
    • una subcarpeta llamada css que incluya un documento style.css
    • una subcarpeta llamada img para almacenar las imágenes

  • Referencia el archivo css correctamente desde index.html (0,5 puntos)

  • La página web debe tener un ancho máximo de 1200px y dos fuentes de Google Fonts, una para los títulos y otra para el cuerpo (resto del texto) (0,5 puntos)

  • Genera un header con un título en el centro, un color de fondo y una imagen a la derecha (1 punto)

  • Genera una sección con un título, un color de fondo y cuatro artículos, dos a cada lado (1 punto)

  • Añade los 3 primeros artículos una imagen (la que quieras) a la izquierda, un título, un enlace a otra página y un texto de unas 5 líneas. (1 punto)

  • Añade al último artículo un título, un texto de varias líneas y una imagen de fondo. (1 punto)

  • Añade un footer con un texto de dos líneas más pequeño que el resto y alineado al centro (1 punto)

  • En pantallas pequeñas, los artículos deben ocupar el 100% (estar uno debajo del otro) (1 punto)

  • En pantallas muy pequeñas, la imagen del header estará encima y el título debajo (o el título encima y la imagen debajo, el caso es que estén uno arriba y otro abajo) (1 punto)

  • En En todos los tamaños, ajusta las fuentes, tamaños de imágenes, etc para que queden bien encajadas (0,5 puntos)

  • Se reserva 1 punto adicional para el diseño, estilo, nuevas funcionalidades, comentarios en el código, etc.

La práctica se expondrá al resto de alumnos en clase (explicando cómo se han conseguido los diferentes estilos) en orden aleatorio el lunes 30 de noviembre a partir de las 08:00.
Fecha de publicación: 21/09/2020
Asignaturas: aplicaciones web
Temas: aplicaciones web
Utilizamos cookies propias y de terceros para mejorar su experiencia en la navegación. Al seguir navegando entendemos que acepta su uso.
Si lo desea, consulte nuestras políticas de privacidad y cookies
ENTENDIDO
[X] Cerrar

Contacta conmigo


[X] Cerrar

Acceso alumnos