Imágenes

Ejemplo: Imagenes.

HTML nos proporciona la etiqueta para insertar imágenes dentro de nuestra página web. A diferencia de las etiquetas que vimos anteriormente, esta no requiere de la etiqueta de cierre, pero si de una serie de propiedades o atributos, los cuales veremos a continuación.

• src: Este atributo es el que indica la URL o ruta dónde se encuentra alojada la imagen que se quiere mostrar.
• align: Este atributo alinea la imagen, utilizando el valor "left" se alineará la izquierda, "right" para alinearla a la derecha, "top" para alinear la imagen con un texto en la parte superior, "bottom" para alinear la imagen con un texto en la parte inferior y "middle" para alinear la imagen con un texto al centro.
• title: Con este atributo se puede colocar una descripción a la imagen. Esta se mostrará al pasar el ratón por encima.
• height, width: El atributo height marca la altura de la imagen, mientras que width marca el ancho de esta.
• alt: Con este atributo se puede especificar un texto alternativo para la imagen.

Un ejemplo del uso de esta etiqueta se muestra a continuación:

Hipervínculos

Ejemplo: Hipervínculos.

Un hipervínculo es un enlace que permite de una manera muy cómoda redirigir al usuario a otra página web o a otra parte dentro de la misma página o archivo, dando clic sobre este.

Las etiquetas para especificar un enlace es <a> y </a>. El texto que se mostrará para el enlace se debe colocar entre estas etiquetas de apertura y cierre.

Los principales atributos o propiedades de los hipervínculos son:

• href: Especifica la URL, ruta o dirección a la cual se quiere ir al hacer clic sobre el enlace.
• target: Específica donde se abre el documento enlazado. El target puede ser “_blank” para indicar que el documento enlazado se abrirá en otra pestaña del navegador o ventana si el navegador no soporta pestañas, “_self” para indicar que se abrirá en el mismo frame donde se encontraba el enlace, “_parent” para indicar que se abrirá en un frame padre y “_top” para indicar que se abrirá en un frame de tamaño completo de toda la página.

A continuación, veremos algunos ejemplos del uso de los enlaces.

Por defecto los enlaces se muestran en color azul y subrayado, esto nos ayuda a identificarlos fácilmente dentro de un documento.

En los 2 casos cuando demos clic en el enlace, la nueva página se mostrará en una nueva pestaña y el enlace cambiará a un color morado indicando que el enlace ya ha sido visitado.

También es posible establecer una imagen como enlace de la siguiente manera:

Ejemplo: Imagen con Hipervínculo.

Al hacer clic sobre la imagen se redirigirá al enlace especificado.