Practica 5 HTML - Enlaces y texto-imagen en movimiento

3

Click here to load reader

description

Los famosos "links" y una práctica extinta llamada "marquesina" son los protagonistas de esta práctica.

Transcript of Practica 5 HTML - Enlaces y texto-imagen en movimiento

Page 1: Practica 5 HTML - Enlaces y texto-imagen en movimiento

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:

Page 2: Practica 5 HTML - Enlaces y texto-imagen en movimiento

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

Page 3: Practica 5 HTML - Enlaces y texto-imagen en movimiento

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.