in

Imagen HTML – javatpoint

Etiqueta img HTML se utiliza para mostrar la imagen en la página web. La etiqueta HTML img es una etiqueta vacía que solo contiene atributos, las etiquetas de cierre no se utilizan en el elemento de imagen HTML.

Veamos un ejemplo de imagen HTML.

Pruébelo ahora

Producción:

Buenos días amigos


Atributos de la etiqueta img HTML

Src y alt son atributos importantes de la etiqueta img HTML. Todos los atributos de la etiqueta de imagen HTML se dan a continuación.

1) src

Es un atributo necesario que describe la fuente o ruta de la imagen. Indica al navegador dónde buscar la imagen en el servidor.

La ubicación de la imagen puede estar en el mismo directorio o en otro servidor.

2) alt

El atributo alt define un texto alternativo para la imagen, si no se puede mostrar. El valor del atributo alt describe la imagen en palabras. El atributo alt se considera bueno para los prospectos de SEO.

3) ancho

Es un atributo opcional que se utiliza para especificar el ancho para mostrar la imagen. No se recomienda ahora. Debe aplicar CSS en lugar del atributo de ancho.

4) altura

H3 la altura de la imagen. El atributo de altura HTML también admite elementos de iframe, imagen y objeto. No se recomienda ahora. Debe aplicar CSS en lugar del atributo de altura.


Uso del atributo de altura y ancho con etiqueta img

Ha aprendido cómo insertar una imagen en su página web, ahora si queremos dar algo de alto y ancho para mostrar la imagen de acuerdo con nuestro requisito, entonces podemos configurarlo con los atributos de alto y ancho de la imagen.

Ejemplo:

Pruébelo ahora

Producción:

Imagen HTML

Nota: Siempre intente insertar la imagen con alto y ancho, de lo contrario puede parpadear mientras se muestra en la página web.


Uso del atributo alt

Podemos usar el atributo alt con etiqueta. Mostrará un texto alternativo en caso de que la imagen no se pueda mostrar en el navegador. A continuación se muestra el ejemplo del atributo alt:

Producción:

Imagen HTML


¿Cómo obtener una imagen de otro directorio / carpeta?

Para insertar una imagen en tu web, esa imagen debe estar presente en tu misma carpeta donde has puesto el archivo HTML. Pero si, en algún caso, la imagen está disponible en algún otro directorio, entonces puede acceder a la imagen de esta manera:

En la declaración anterior hemos puesto la imagen en el disco local E ——> carpeta de imágenes ——> animal.png.

Nota: Si la URL src es incorrecta o está mal escrita, entonces no mostrará su imagen en la página web, así que intente poner la URL correcta.


Utilice la etiqueta como enlace

También podemos vincular una imagen con otra página o podemos usar una imagen como vínculo. Para hacer esto, coloque la etiqueta dentro de la etiqueta .

Ejemplo:

Pruébelo ahora

Producción:

Imagen HTML


Navegadores compatibles


Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

kafka topics

Temas de Kafka – javatpoint

NdcsiSECauXGG5BpjEtdMP 1200 80

Nuevo software de foros que llega al hardware de Tom