Balise HTML img est utilisé pour afficher une image sur la page Web. La balise HTML img est une balise vide qui contient uniquement des attributs, les balises de fermeture ne sont pas utilisées dans l'élément d'image HTML.
Voyons un exemple d'image HTML.
liste de tableaux de tri Java
<h2>HTML Image Example</h2> <img src="//techcodeview.com/img/html-tutorial/39/html-image.webp" alt="Good Morning Friends">Testez-le maintenant
Sortir:
Attributs de la balise HTML img
Le src et l'alt sont des attributs importants de la balise HTML img. Tous les attributs de la balise d'image HTML sont indiqués ci-dessous.
1) src
C'est un attribut nécessaire qui décrit la source ou le chemin de l'image. Il indique au navigateur où rechercher l'image sur le serveur.
L'emplacement de l'image peut être sur le même répertoire ou sur un autre serveur.
2) tout
L'attribut alt définit un texte alternatif pour l'image, si elle ne peut pas être affichée. La valeur de l'attribut alt décrit l'image avec des mots. L’attribut alt est considéré comme bon pour la prospective SEO.
3) largeur
C'est un attribut facultatif qui est utilisé pour spécifier la largeur d'affichage de l'image. Ce n’est pas recommandé maintenant. Vous devez appliquer CSS à la place de l'attribut width.
modèles de programmation Java
4) hauteur
Il h3 la hauteur de l'image. L'attribut HTML height prend également en charge les éléments iframe, image et object. Ce n’est pas recommandé maintenant. Vous devez appliquer CSS à la place de l'attribut height.
ml en onces
Utilisation de l'attribut height et width avec la balise img
Vous avez appris comment insérer une image dans votre page Web. Maintenant, si nous voulons donner une hauteur et une largeur pour afficher l'image selon nos besoins, nous pouvons la définir avec les attributs de hauteur et de largeur de l'image.
Exemple:
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image">Testez-le maintenant
Sortir:
Remarque : essayez toujours d'insérer l'image en hauteur et en largeur, sinon elle risque de scintiller lors de son affichage sur la page Web.
Utilisation de l'attribut alt
Nous pouvons utiliser l'attribut alt avec étiqueter. Il affichera un texte alternatif au cas où l'image ne pourrait pas être affichée sur le navigateur. Voici l'exemple de l'attribut alt :
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp" alt="animal image">
Sortir:
multiplexeur deux à un
Comment récupérer une image d’un autre répertoire/dossier ?
Pour insérer une image dans votre site Web, cette image doit être présente dans votre même dossier où vous avez placé le fichier HTML. Mais si dans certains cas, l'image est disponible dans un autre répertoire, vous pouvez accéder à l'image comme ceci :
Dans la déclaration ci-dessus, nous avons placé l'image sur le disque local E------>dossier images------>img/html-tutorial/39/html-image-2.webp.
Remarque : Si l'URL src est incorrecte ou mal orthographiée, votre image n'affichera pas sur la page Web, alors essayez de mettre l'URL correcte.
Utiliser tag comme lien
Nous pouvons également lier une image à une autre page ou utiliser une image comme lien. Pour ce faire, mettez étiquette à l'intérieur du étiqueter.
Exemple:
<img src="//techcodeview.com/img/html-tutorial/39/html-image-2.webp">Testez-le maintenant
Sortir:
Navigateurs pris en charge
Élément | Chrome | C'EST À DIRE | Firefox | Opéra | Safari |
Oui | Oui | Oui | Oui | Oui |