ACTIVIDADES HyperText Markup Language (HTML)

Aplicaciones Web

HTML - Actividades

1. Encabezados - Prrafos - Atributos del texto

Ejercicio 1.1: Cada prrafo con diferente tipo de letra

Ejercicio 1.2: Ttulo en color, prrafos con diferentes atributos de texto

Aplicaciones Web

HTML - Actividades

Ejercicio 1.3: Ttulos de cabecera. Poner cada ttulo con un color diferente y alineacin.

Ejercicio 1.4: Ttulo, prrafos y lnea

Aplicaciones Web

HTML - Actividades

Ejercicio 1.5: Atributos de texto

Ejercicio 1.6: Caracteres especiales

Aplicaciones Web

HTML - Actividades

2. Listas
Ejercicio 2.1: Listas numeradas y no numeradas

Aplicaciones Web

HTML - Actividades

Ejercicio 2.2: Crear listas anidadas

Ejercicio 2.3: Listas

Aplicaciones Web

HTML - Actividades

Ejercicio 2.4: Crear una lista no numerada

Ejercicio 2.5: Lista de definicin

Aplicaciones Web

HTML - Actividades

3. Imgenes
Ejercicio 3.1: Alinear una imagen

Aplicaciones Web

HTML - Actividades

Ejercicio 3.2: Imagen con alineacin de texto

Ejercicio 3.3: Insertar imagen en lnea. La imagen es un link.

Aplicaciones Web

HTML - Actividades

Ejercicio 3.4: Imagen, lista y barra

10

Aplicaciones Web

HTML - Actividades

Ejercicio 3.5: Ajustar texto alrededor de ms de una imagen

Ejercicio 3.6: Uso de una imagen como fondo y preformatear

11

Aplicaciones Web

HTML - Actividades

4. Hiperenlaces
Ejercicio 4.1: Enlaces con imgenes

Ejercicio 4.2: Crear anclas

12

Aplicaciones Web

HTML - Actividades

Ejercicio 4.3: Crear anclas

Ejercicio 4.4: Crear atajos de teclado para los enlaces

13

Aplicaciones Web

HTML - Actividades

5. Tablas
Ejercicio 5.1: Crear tabla coloreada

Ejercicio 5.2: Crear tabla con bordes

Ejercicio 5.3: Crear tabla con celdas combinadas

14

Aplicaciones Web

HTML - Actividades

Ejercicio 5.4: Crear tabla sin borde superior e inferior

Ejercicio 5.5: Crear tabla con alineaciones

15

Aplicaciones Web

HTML - Actividades

Ejercicio 5.6: Crear tabla con texto e imagen

16

Aplicaciones Web

HTML - Actividades

6. Frames
Ejercicio 6.1: Realizar tres frames
Realizar una pgina web dividida en tres marcos. El marco superior tendr una lnea de texto del mayor tamao posible donde dir Pgina con frames. En el marco de la izquierda habr cinco enlaces a Google, Yahoo, Altavista, Terra y Msn. Cada enlace deber abrirse con un target diferente, en el marco de la derecha se abrir uno de los enlaces.

Ejercicio 6.2: Realizar cinco frames

Realizar una pgina web dividida en cinco marcos tal y como se ve en la imagen.

Ejercicio 6.3: Realizar una pgina con un iframe

17

Aplicaciones Web

HTML - Actividades

7. Formularios
Ejercicio 7.1: Formulario con carga de archivos

Ejercicio 7.2: Enviar datos de formulario por email

18

Aplicaciones Web

HTML - Actividades

Ejercicio 7.3: Enviar datos de formulario por email

Realiza un formulario que enve los datos a la direccin de correo electrnico midireccion@correo.com de forma segura como texto plano para ser procesados. Dicho formulario debe contener los campos: Nombre: El tamao de caja ser 10 pxeles y la longitud mxima del texto ser 15. Apellidos: El tamao de caja ser 10 pxeles y la longitud mxima del texto ser 25. Telfono: Tendr un tamao de caja igual a 10 y una longitud mxima de texto de 9. DNI: Este campo tendr un tamao de caja de 10, su texto poseer una longitud mxima de 9 y ser de tipo password. Gnero: Tendr dos botones de radio para seleccionar si el usuario es hombre o mujer. La opcin Mujer aparecer seleccionada por defecto. Sugerencias: Ser un campo de texto con 5 lneas y 30 columnas. Un cuadro de validacin para seleccionar si se desea recibir las novedades de la web (activado por defecto). Un desplegable en el que den una calificacin a la web. Tendr 4 opciones: Me gusta mucho Me gusta bastante Podra mejorarse No me gusta nada Un botn de envo de informacin y un botn de borrado.

19

Aplicaciones Web

HTML - Actividades

Ejercicio 7.4: Enviar datos de formulario por email

Realiza un formulario que enve los datos a la direccin de correo electrnico autobuses@correo.com de forma segura como texto plano para ser procesados. Dicho formulario debe contener los campos: Nombre: El tamao de caja ser 30 pxeles y la longitud mxima del texto ser 100. Email: El tamao de caja ser 25 pxeles y la longitud mxima del texto ser 100. Tendr por defecto el valor @. Poblacin: El tamao de caja ser 20 pxeles y la longitud mxima del texto ser 60. Tendr por defecto el valor Badalona. Gnero: Tendr dos botones de radio para seleccionar si el usuario es hombre o mujer. La opcin Hombre aparecer seleccionada por defecto. Frecuencia de los viajes: Ser un desplegable en el que el usuario podr seleccionar varias opciones. Se tendrn que ver 3 opciones, la opcin Una vez al da ser la que salga por defecto seleccionada. Las opciones sern: Varias veces al da Una vez al da Varias veces a la semana Varias veces al mes Comentarios sobre su satisfaccin personal: Ser un campo de texto con 7 lneas y 30 columnas. Un cuadro de validacin para seleccionar si se desea recibir notificaciones de las novedades en las lneas de autobuses (activado por defecto). Un botn de envo de informacin. Un botn de borrado. Un campo de datos ocultos en el que se enve la informacin de la web, www.autobuses.com Deber aparecer una imagen al lado del campo Comentarios sobre su satisfaccin personal. El archivo se llama autobuses.jpg.

20