En HTML, ¿qué es una etiqueta de imagen?
Al crear una página web usando HTML, la etiqueta de imagen se usa para insertar una foto o gráfico en un lugar particular en la página. Hay muchas maneras en que las imágenes se pueden usar en las páginas web, desde agregar interés hasta ser utilizados como herramienta de navegación o para proporcionar información. También hay varios formatos diferentes de imágenes que se pueden usar. No importa cómo o qué imagen se agrega a la página web, siempre se requiere la etiqueta de imagen.
Para agregar una imagen, la etiqueta de imagen se incluye donde desea que aparezca la imagen dentro de su página. Por ejemplo, si se insertara una imagen después de este párrafo, la etiqueta de imagen, o , se agregaría al documento HTML después de este párrafo. La etiqueta
define todas las imágenes en HTML. Se conoce como una etiqueta vacía, ya que contiene atributos y no tiene etiqueta de cierre. Los atributos son opciones disponibles para una etiqueta HTML específica.
si solo se agregaron a un documento HTML, no se mostraría nada ya que no se han incluido los atributos de la etiqueta. El atributo más importante para
es "SRC", que significa fuente. El atributo SRC establece donde realmente se encuentra el archivo de imagen, o es la dirección del archivo de imagen. A medida que la imagen se usa en una página web, la ubicación de la imagen se dará como URL. Dentro del documento HTML, la imagen se vería como:
. p>
Específicamente, la URL apunta a donde se almacena la imagen. Por ejemplo, si una imagen de una computadora con el nombre de archivo Computer.jpg se almacenó en la carpeta de imágenes en www.wisegeek.com, la URL se reemplazaría con: . Cuando el navegador abre la página web, muestra la imagen donde se incluye la etiqueta de imagen.
La etiqueta de imagen tiene varios otros atributos diferentes. Permiten que un usuario ajuste cómo se ve la imagen en la página. Los siguientes atributos son comMonly Usado para esta etiqueta: alt, borde, tamaño y alinearse.
El atributo alt significa texto alternativo y se muestra si un navegador no puede mostrar una imagen. Además, se lee texto alternativo para aquellos usuarios que tienen desafíos visuales y eligen mostrar texto a través de imágenes. Para el ejemplo anterior, el texto alternativo podría establecerse como alt = "imagen de una computadora".
El atributo border agrega un borde a la imagen con el grosor dependiendo del número de píxeles establecidos. Esto puede ser especialmente útil cuando el fondo de la imagen y el fondo del sitio web son similares, y se desea una distinción clara. Por ejemplo, el borde = "10" colocará un borde de 10 píxeles de espesor alrededor de una imagen.
Los atributostamaño también son importantes, ya que el ancho y la altura pueden usarse para especificar el tamaño exacto de una imagen. Estos atributos deben usarse con mucho cuidado, ya que cambiarlos puede afectar las proporciones o la calidad de la imagen mostrada. Atti de tamañoBUTES no cambia el archivo real, cómo lo muestra el navegador.
El atributo alineada especifica cómo se alinea la imagen en comparación con el texto en la página. Hay varias opciones diferentes para este atributo, incluidos los tipos, inferior, medio, izquierdo, derecho, absgmiddle, absbottom, línea de base y texttop. Estas etiquetas también ayudan a determinar cómo se alinea el texto en la página con la imagen.