Ejercicios HTML y CSS

UNIDAD 2: Lenguajes para la visualización de información
Documento con los ejercicios del tema 2, referentes a XHTML y CSS

U.2: Lenguajes para la visualización de la información

Tema 2: XHTML

1. Elaboración de la primera página web. Se crea una carpeta en el disco duro para
guardar las páginas web. Se abre el Bloc de notas para crear la web y se escribe el
siguiente texto.



Miprimera página web


Este es el cuerpo de mi página web


Nómbrala actividad1.html y guárdala en la carpeta creada. Si detectas algún error,
corrígelo.
Visualiza la página utilizando algún navegador web. Asegúrate que es válida según la
W3C.

2. Confeccionar el titular de un periódico con un título de nivel 1. Luego definir dos
títulos de segundo nivel con los textos (Noticiaspolíticas y Noticias deportivas),
en cada una de estas secciones definir dos titulares de tercer nivel con un párrafo
cada una. Al final de la página mostrar un título de cuarto nivel con el nombre de
la empresa propietaria del periódico.

2

U.2: Lenguajes para la visualización de la información
3. Determinar el código HTML correspondiente a la siguiente página:

4. Estructurar y marcar elsiguiente texto extraído de la Wikipedia:
http://es.wikipedia.org/wiki/Exploración_espacial

3

U.2: Lenguajes para la visualización de la información
5. Estructurar y marcar el siguiente texto para que el navegador lo muestre con el
aspecto de la siguiente imagen:

Cosas a tener en cuenta:
•

Utilizamos dos acrónimos:
o JPL: Laboratorio de Propulsión a Chorro.
o NASA: NationalAeronautics and Space Administration

6. Realiza los cambios oportunos en el ejercicio anterior para definir la palabra
perenne con la ayuda de la etiqueta

•

Tenemos la definición de perenne, que es: que dura todo el año

4

U.2: Lenguajes para la visualización de la información

7. Determinar el código HTML que corresponde al siguiente documento:

8. Determinar el código HTML quecorresponde a la siguiente lista anidada simple:

5

U.2: Lenguajes para la visualización de la información
9. Determinar el código HTML que corresponde a la siguiente lista anidada:

10. A partir de la estructura de directorios y archivos indicada en la siguiente imagen:

6

U.2: Lenguajes para la visualización de la información
a) Crear la siguiente página llamada indice.html que sirvacomo página principal
del sitio:

b) Crear la página de índice del portfolio:

7

U.2: Lenguajes para la visualización de la información
11. Modificar la página de índice del portfolio del ejercicio 10 para mostrar
directamente las imágenes de los proyectos.

12. Enlazar el favicon en todas las páginas del ejercicio 10 y añadir todos los
atributos posibles a los enlaces.

13.Determinar el código HTML necesario para crear la siguiente tabla que se
muestra a continuación:

Utilizar las celdas de cabecera donde sea necesario y añadir todos los atributos
posibles.

8

U.2: Lenguajes para la visualización de la información
14. Determinar el código HTML necesario para crear la tabla que se muestra en la
siguiente imagen. Utilizar las celdas de cabecera donde seanecesario y añadir
todos los atributos posibles.

9

U.2: Lenguajes para la visualización de la información
15. Determinar el código HTML necesario para crear la tabla que se muestra en la
siguiente imagen:

Emplear las etiquetas , , , , y los atributos colspan,
rowspan, abbr, scoop, summary.

10

U.2: Lenguajes para la visualización de la información
16. Determinar el código HTMLnecesario para crear el formulario que se muestra en
la siguiente imagen:

a) Elegir el método más adecuado para el formulario (GET o POST) y cualquier
otro atributo necesario.
b) La aplicación que se encarga de procesar el formulario se encuentra en la raíz
del servidor, carpeta "php" y archivo "insertar_cv.php" .
c) El nombre puede tener 30 caracteres como máximo, los apellidos 80...