Practica 5 HTML - Enlaces y texto-imagen en movimiento
1. ENLACES y TEXTO/IMAGEN EN MOVIMIENTO
ENLACES
Antes que nada cree una carpeta en el escritorio y llámela images. Esta carpeta servirá para guardar las
imágenes que ocuparemos en los ejercicios de esta práctica.
Las imágenes utilizadas en esta página son las siguientes. No olvide guardarlas en la carpeta creada
previamente.
Imagen del jugador de futbol: http://goo.gl/ZT9mpH
Imagen de las flores: http://goo.gl/mYQjGS
NOTA IMPORTANTE: los nombres de las imágenes deben coincidir. Si el nombre de la imagen es
distinto al que aparece en el código o si la extensión o carpeta especificada no coinciden, entonces la
imagen NO se mostrará en la página web.
Una vez descargadas las imágenes, se procederá a la escritura de la página web.
Abra Sublime Text 3 y escriba el siguiente código en un archivo llamado enlaces.html
Una vez terminado ejecute esta página en el navegador y deberá de verse de la siguiente manera:
2. Haga clic sobre los enlaces creados y sobre las imágenes que se muestran en el sitio.
TEXTO/IMAGEN EN MOVIMIENTO
Se utilizará un concepto llamado MARQUESINA, lo cual es un cuadro que se desplaza el texto o imagen.
Para este ejercicio se descargará la siguiente imagen: http://goo.gl/TYgHqR
Abra un nuevo documento de Sublime Text 3, escriba lo siguiente y guárdelo como marquesina.html
3. Ahora en el navegador deberá de verse algo así:
Como podrá notar, tanto los textos como las imágenes ahora poseen movimiento.
Antes de finalizar solamente unas aclaraciones importantes:
Cuando se utilicen imágenes que NO se encuentren en la misma carpeta del archivo HTML,
deberá colocar la ruta de carpetas donde se encuentra la imagen, no olvidando el nombre
correcto de esta y su extensión.
Al escribir la dirección de un enlace:
o Si apunta un sitio web, no debe de olvidar escribirlo de esta forma: http://nombredelsitio
o Si apunta a un correo electrónico se escribe mailto:direcciondecorreo
La etiquetas <center></center> y <marquee></marquee> han quedado obsoletas gracias a
tecnologías mucho más modernas como CSS. Sin embargo, esto no impide su utilización.