Ejercicios de Lenguaje HTML (I)
Ejercicio 1
1.- Abre el Bloc de Notas y escribe el siguiente texto:
<HTML>
<HEAD>
<TITLE>Mi primera pgina</TITLE>
<HEAD>
<BODY>
<CENTER><H1>Mi primera pgina</H1></CENTER>
<HR>
<P>Esta es mi primera pgina
</BODY>
</HTML>
2.- Gurdalo con el nombre [Link]
3.- Arranca el navegador y abre el fichero que acabas de crear.
Ejercicio 2
Edita el fichero [Link] y pon el siguiente cuerpo a la pgina.
<H1>TTULO 1</H1>
<H2>TTULO 2</H2>
<H3>TTULO 3</H3>
<H4>TTULO 4</H4>
<H5>TTULO 5</H5>
<H6>TTULO 6</H6>
Slvalo con el nombre [Link] y luego brelo con el navegador.
Ejercicio 3
1.- Edita el fichero [Link] y pon en el cuerpo dos o tres prrafos (de tres
o cuatro lneas cada prrafo) de la informacin que ud. Quiera realizar una
pgina web. Separe los prrafos sin poner etiquetas, slo pulsando Intro una o
dos veces. Slvalo, y luego edtalo con tu navegador. Observa que los prrafos
se ven juntos.
2.- Sigue con la edicin del fichero, pon las etiquetas <P> a cada prrafo. Slva
el fichero y brelo con el navegador.
3.- Aumenta la separacin entre prrafos con <BR> y <P>.
Ejercicio 4:
Para comprobar cmo se pueden alinear textos.
1.- Edita el fichero [Link] y justifica todos los prrafos con
<DIV align=justify>. Comprueba en el navegador la presentacin.
2.- Ahora centra el prrafo y ajusta a la derecha el segundo. Comprueba el
resultado.
Ejercicio 5:
Para cambiar el aspecto de la letra
1.- Edita el fichero [Link] y pon a las frases del primer
prrafo las etiquetas adecuadas para que aparezcan en negrita, cursiva y
teletipo.
2.- Usa la etiqueta <FONT> con size = 1,2, etc., para tener las primeras
palabras del segundo prrafo en tamao creciente.
3. Ahora usa la etiqueta <FONT> con size = + 1, - 1, + 2, - 2, etc. para tener
las primeras palabras del segundo prrafo en tamao creciente y decreciente.
Ejercicio 6:
Para comprobar los parmetros de los colores. Gua de colores
Black Silver Gray White Maroon Red Purple Fuchsia
Green Lime Olive Yellow Navy Blue Teal Aqua
1.- Haz un fichero [Link] con varias lneas como la siguiente,
una para cada uno de los colores de la tabla anterior.
<FONT color=red>Rojo</FONT>
Ejercicio 7:
1.- Haz un fichero [Link] con el siguiente texto:
<FONT COLOR=#FF0000>Rojo 100%</FONT>
<FONT COLOR=#8F0000>Rojo 50%</FONT>
<FONT COLOR=#4F0000>Rojo 25%</FONT><P>
<FONT COLOR=#00FF00>Verde 100%</FONT>
<FONT COLOR=#008F00>Verde 50%</FONT>
<FONT COLOR=#004F00>Verde 25%</FONT><P>
<FONT COLOR=#0000FF>Azul 100%</FONT>
<FONT COLOR=#00008F>Azul 50%</FONT>
<FONT COLOR=#00004F>Azul 25%</FONT>
Slvalo y lelo en tu navegador.
2.- Cambia los colores RGB anteriores y observa los resultados.
3.- Experimenta con los cdigos para obtener el color amarillo.
Ejercicio 8:
Para comprobar cmo hacer hipertexto.
Los mecanismos ms usados son los siguientes:
1.- Haz una pgina llamada [Link] donde poner enlaces a
sitios interesantes. Por ejemplo, puedes empezar con el siguiente texto:
<HTML>
<HEAD>
<meta http-equiv=Content-Type content=text/html; char-
set=ISO-8559-1>
<TITLE>Sitios de inters</TITLE>
</HEAD>
<BODY>
<CENTER>
<H1>Mis pginas favoritas</H1>
</CENTER>
<HR>
Estas son mis pginas favoritas:
<P><A HREF=[Link]
<BR> <A
HREF=[Link]
ES Alfonso Romero Barcojo</A>
</BODY>
</HTML>
Ejercicio 9:
Para comprobar cmo se hacen listas.
Listas desordenadas:
Listas ordenadas:
Ejercicio 10:
Haz una lista desordenada con los nombres:Desayuno, almuerzo, refaccin y
Cena.
Convierte en ordenada la lista anterior.
Ejercicio 11:
Para incluir grficos e imgenes en une estas pginas utilizaremos la etiqueta
<IMG> de esta manera:
<IMG SRC="fichero_grafico"" ALT="description"
El parmetro SRC especifica el nombre del fichero que contiene el grfico. Los
formatos de imagen deben ser JGP o GIF. El parmetro ALT especifica el texto
que se mostrar en lugar del grfico en aquellos navegadores que no lo
muestren.
Con los parmetros HEIGHT y WIDTH se puede indicar siempre: la altura y la
anchura del grfico en pxeles.
<IMG SRC="animales/[Link]" ALT="Gato" Width=100 Height=145
El nombre del fichero imagen debe hacer referencia a la carpeta de origen del
mismo. No se pondr si sta es la misma que la del documento HTML que
estamos elaborando.
Se puede alinear una imagen a la izquierda o a la derecha de la pgina. Esto se
consigue con los parmetros ALIGN= RIGHT (imagen a la derecha) y
ALIGN=LEFT (la imagen queda a la izquierda).
Tambin se puede poner una imagen como fondo de toda la pgina. Esto se
consigue poniendo el parmetro BACKGRONUD="imagen" en la etiqueta
<BODY>, siendo imagen el nombre del fichero grfico GIF o JPG.
<BODY BACKGROUND="animales/[Link]">
Apoyndote en la explicacin anterior, edita el archivo del ejercicio n 3 e
inserta una imagen centrada detrs de cada prrafo.
Ejercicio 12:
Edita el archivo n 6 y coloca como imagen de fondo de la pgina una paleta de
colores que captures en Internet.