La imagen no se inserta directamente en el texto. Al navegador se le dice su nombre y se le indica dónde y cómo colocarlo en la pantalla. Para hacer esto, use una sola etiqueta HTML img. Especifica la ubicación del objeto gráfico en la página web.
Si muchos atributos son opcionales para las etiquetas, entonces la etiqueta img debe tener al menos un parámetro: la dirección de la imagen. Este atributo se llama src:
- - esto mostrará el archivo cabra-j.webp" />
- : con este parámetro de la etiqueta img, el navegador cargará la imagen publicada en Internet en el sitio megasellmag.ru.
Atributos de alineación
Para posicionar imágenes en una página usando HTML, se utiliza la etiqueta img, cuyos atributos son los responsables de colocar la imagen en la página y la naturaleza de su envoltura de texto.
De forma predeterminada, el navegador coloca la imagen en el centro de la pantalla y el texto no la envuelve. La etiqueta img le permitirá expresar su desacuerdo con el navegador mediante el atributo align (alineación).
: la imagen se colocará en el borde izquierdo de la página y el texto la rodeará por el lado derecho.
El comportamiento del texto será similar si la imagen se coloca a la derecha (align=right), en el medio (align=middle), arriba (align=top), abajo(alinear=abajo) y centro (centro).
Configuraciones y tamaños
Para evitar que el texto se filtre en las imágenes, la etiqueta img ha adquirido atributos especiales -hspace (márgenes horizontales/horizontales) y vspace (márgenes verticales/verticales), que determinan la cantidad de sangría de texto desde los bordes de las imágenes en píxeles.
La imagen no solo se alejará obedientemente del texto en la cantidad especificada, sino que también se alejará del borde de la página, por lo que es mejor evitar las sangrías grandes.
Las dimensiones geométricas de las imágenes son muy importantes, las cuales no solo son deseables, sino que a veces simplemente es necesario especificarlas para la correcta visualización de la imagen. Para ello se utilizan los atributos ancho (ancho) y alto (alto), cuyo valor se establece en píxeles o porcentajes.
Si especificas solo el ancho, la altura se seleccionará automáticamente con las proporciones originales. Los tamaños porcentuales le permiten colocar la imagen en la parte derecha de la página, independientemente del tamaño de la ventana del navegador, y esta necesidad surge con frecuencia.
Otras opciones
El atributo de borde encierra la imagen en un marco del grosor especificado, lo que el navegador no hace de forma predeterminada.
El borde también puede tener un ancho cero aparentemente sin sentido (borde='0'), pero eso es hasta que la imagen se convierte en un enlace, cuando el navegador lo rodea automáticamente con un borde azul sin esperar instrucciones.
Algunos usuarios impacientes, furiosos con las bajas velocidades de Internet, simplemente desactivarán la visualización de imágenes. Para tales casos, se proporciona el parámetro alt, que le permite ingresartexto alternativo que el usuario verá en el cuadro donde la imagen tiene prisa por cargar.
Si no le gustan las posibilidades del parámetro alt, la etiqueta img puede ofrecer un atributo longdesc, cuyo valor es la URL de un documento con una descripción más detallada.
Los atributos usemap e ismap le dicen al navegador que la imagen será una imagen en la que los hipervínculos son áreas separadas (mapa de enlace), solo el parámetro usemap determina el mapa de navegación en el servidor e ismap - el mapa en el lado del cliente.
Descripción del enlace 1 en la siguiente figura:
Artículos exóticos
El atributo lowsrc indica al navegador que primero descargue una copia (u otra alternativa) de la imagen original con una calidad inferior y, por lo tanto, "más clara". Este truco se proporciona en caso de baja velocidad de Internet para el usuario. La imagen original, cuando se carga, reemplaza a la "falsa".
El atributo galeríaimg de la etiqueta img, que se usa con menos frecuencia, invoca el panel de control de imágenes (cuando se pasa el cursor sobre él), lo que le permite abrir la carpeta Mis imágenes predeterminada e imprimir, guardar o enviar por correo electrónico la imagen. Puede deshabilitar el panel configurando el parámetro galeríaimg en no/falso y habilitarlo configurando sí/verdadero.
En la nueva especificación HTML5, varias etiquetas tienen algunos parámetros en desuso. Por ejemplo, se han retirado los atributos lowsrc, border, longdesc y name de img.
