Les images sont une partie très importante d'une page Web car elles améliorent l'apparence d'une page Web et augmentent l'interaction avec le client. L'USP de plusieurs sites Web est la façon dont ils organisent différentes images sur leurs pages Web et y ajoutent des saveurs. Dans ce Article Images, nous allons comprendre comment intégrer des images dans une page Web en utilisant HTML dans l'ordre suivant:
Comment ajouter une image en HTML
Pour incorporer une image dans une page Web, le HTML vous donne marque. Un autre point important à retenir est,
n'a pas de balise de fermeture. scr L'attribut est utilisé pour spécifier le chemin de l'image, qui peut être une URL ou un chemin d'image du système / serveur. Commençons par la syntaxe de base de l'incorporation d'une image dans une page Web en utilisant HTML.
Syntaxe
img src = 'img / développement-web-frontal / 50 / qu'est-ce-que-html-images.png'>Exemple de code
Image HTML incorporant des images dans la page Web
À l'instar d'autres balises, divers attributs sont associés à marque. Regardons chacun d'eux un par un, comprenons leur besoin et comment les utiliser.
Balises d'images HTML
- Attribut alt
L'attribut alt est le texte alternatif d'une image. La raison pour laquelle l'attribut alt a été introduit est que si, pour une raison quelconque, l'image n'a pas pu se charger, un texte alternatif devrait apparaître pour donner une idée de l'image. Les raisons pour lesquelles l'image ne se charge pas peuvent être une connexion Internet lente ou l'image ne réside pas dans la source fournie, etc.
Si l'image réside dans le même dossier que le fichier HTML, vous pouvez spécifier directement le nom du fichier. Sinon, vous devez fournir le chemin absolu du fichier image.
La valeur de l'attribut alt doit décrire l'image.
Exemple
Image HTML incorporant des images dans la page Web
comment utiliser replace en java
- Largeur et hauteur d'une image
L'attribut Style est utilisé pour définir la hauteur et la largeur d'une image. Dans l'attribut style, vous spécifiez le style CSS.
Image HTML incorporant des images dans la page Web
Certains des points importants lors de l'intégration d'une image dans une page Web à l'aide de HTML sont:
- Les attributs de largeur et de hauteur sont définis en pixels.
- Vous pouvez également définir la largeur et la hauteur d'une image en pourcentage. Il considérera le pourcentage en fonction de l'ensemble de la page Web.
- Si vous ne spécifiez que l'un d'entre eux, il ajuste l'autre en conséquence.
- Incorporer des images à l'aide d'une URL
HTML vous donne également la flexibilité de choisir l'image d'un autre serveur en spécifiant simplement l'URL. Vous pouvez utiliser un serveur distinct pour héberger les images, puis incorporer ces images à l'aide d'une URL.
Image HTML incorporant des images dans la page Web
- Image comme lien
Vous pouvez également utiliser l'image comme lien où l'utilisateur peut cliquer sur l'image et atterrir sur une nouvelle page Web. Pour ce faire, il vous suffit de mettre le jour après marque.
Image HTML incorporant des images dans la page Web
- Image flottante
Vous pouvez également ajuster l'alignement de l'image à l'aide de la propriété CSS float. Toutes les propriétés CSS doivent être spécifiées dans l'attribut style.
Image HTML
- Cartes d'images
C'est l'une des fonctionnalités importantes fournies par HTML. La balise aide à définir une image-map. Vous devez vous demander ce qu'est une carte image. Une image-map est une image avec des zones cliquables
convertir la chaîne en format de date en java
Image HTML
- Image de fond
Vous pouvez également ajouter une image d'arrière-plan dans une page Web. Il vous suffit d'utiliser la propriété CSS, c'est-à-dire background-image dans la balise de style et de l'ajouter à l'élément HTML.
Image HTMLImage de fond
Élément BODY
Avec cela, nous arrivons à la fin de ce blog HTML Images.Maintenant, après avoir exécuté les extraits ci-dessus, vous auriez compris comment insérer une image en HTML. J'espère que ce blog est informatif et a une valeur ajoutée pour vous.
Découvrez notre qui vient avec une formation en direct animée par un instructeur et une expérience de projet réelle. Cette formation vous permet de maîtriser les compétences nécessaires pour travailler avec les technologies Web back-end et front-end. Il comprend une formation sur le développement Web, jQuery, Angular, NodeJS, ExpressJS et MongoDB.
Vous avez une question pour nous? Veuillez le mentionner dans la section commentaires du blog «Images HTML» et nous vous recontacterons.