Algoritmos

Dada la página MiSitioWeb.html sin estilo (Figuras 1a y 1b) y con estilo (Figura 2), se pide:

a) Programar el código HTML correspondiente la página web MiSitioWeb.html de las Figuras 1a y 1b.

b) Determinar las reglas CSS necesarias para mostrar la página web MiSitioWeb.html con el estilo de la Figura 2.

c) Incluir una foto o imagen cualquiera y los iconos del validador de CSS y de XHTML.

Figura 1a

Figura 1b

Figura 2

Crear la página Acceso.html y codificar la validación de sus datos en JavaScript en un fichero denominado Validacion.js.

Se deben tener en cuenta los siguientes aspectos:

• El formulario, el campo de texto del DNI y el botón de selección de la letra se denominan frmAcceso, txtDNI y sLetra respectivamente.

• Los controles a validar del formulario son que el DNI es obligatorio y numérico y que la selección de la letra debe ser correcta. En caso de error, se deben visualizar según sea el caso los mensajes “Completar el campo txtDNI”, “Teclear un DNI (sin letras, sólo números)” y “La letra del NIF es incorrecta. Seleccionar la letra …”. En los puntos suspensivos tiene que aparecer la letra que el usuario debe elegir nuevamente.

• El algoritmo para calcular la letra del NIF es:

- Calcular el resto de dividir el número del DNI por 23.

- La letra del NIF corresponde al carácter obtenido de la cadena “TRWAGMYFP-DXBNJZSQVHLCKE” en función del valor del resto (ver Tabla 1).

Resto Letra Resto Letra Resto Letra Resto Letra

0 T 6 Y 12 N 18 H

1 R 7 F 13 J 19 L

2 W 8 P 14 Z 20 C

3 A 9 D 15 S 21 K

4 G 10 X 16 Q 22 E

5 M 11 B 17 V

Tabla 1

Se pide:

a) A partir del código ya obtenido en la práctica anterior, codificar algunas de las siguientes reglas CSS en un archivo denominado estilo.css.

• El texto “IDENTIFICACIÓN MEDIANTE EL NIF” se puede incluir en un contenedor denominado “cabecera” con un fondo de color gris y con un tamaño de letra de 24px en color rojo.

• Los textos “DNI” y “Letra” y los campos de entrada de datos se pueden incluir en otro contenedor denominado “principal” con un borde de color negro y de grosor 5px y con un tipo de letra Verdana y de tamaño 14px.

• Los botones se pueden incluir en otro contenedor denominado “fondo” y se pueden mostrar como enlaces, que cambian de color cuando son activados, visitados, etc.

b) Crear una nueva página web denominada Bienvenid@.html que muestre el texto “BIENVENID@ AL EXAMEN” con las mismas características del contenedor “cabecera” del fichero estilo.css.

c) Modificar el/los fichero/s necesarios con la instrucción window.open(“.html”),

...