Table des matières
Il y a des moments où tout n'est pas pour générer un formulaire au sein de nos documents HTML, plusieurs fois nous devons inclure d'autres éléments comme des images au sein de certaines balises pour façonner notre page, pour cela nous verrons dans ce tutoriel comment le faire et les différentes fonctionnalités inclus dans elle-même.Afin d'afficher une image dans notre document HTML, nous devons utiliser l'élément img qui a les attributs suivants :
- src
- alt
- la taille
- largeur
- carte d'utilisation
- ismap
Nous allons maintenant nous concentrer sur les deux premiers attributs, src Oui alt; src permet de donner le chemin à partir duquel le navigateur va rechercher l'image, il peut s'agir d'un chemin relatif ou même d'une URL, l'attribut alt permet de placer un texte, ce texte ne sera affiché que lorsque l'image n'est pas disponible, qu'elle ne soit pas dans le chemin dans lequel il a été spécifié dans le src ou même le navigateur ne peut pas l'interpréter.
Voyons un exemple de la façon d'inclure une image dans notre document HTML :
Exemple Voici une forme courante pour représenter les trois activités d'un triathlon.La première icône représente la natation, la seconde représente le cyclisme et la troisième représente la course à pied.
Dans cet exemple, nous voyons également deux autres attributs, le largeur et le la taille Ceux-ci, comme leurs noms l'indiquent, doivent régler la largeur et la hauteur de l'image, ce qui nous permet de garantir que l'image restera dans les tailles que nous avons établies, même si l'image est plus grande qu'elle sera redimensionnée, sans Cependant, il faut faire attention car l'image aura le même poids, il est donc conseillé de placer l'image déjà éditée de la taille requise et que notre page se charge plus rapidement.
Une autre utilisation assez courante est d'utiliser une image comme lien vers d'autres pages, soit en plaçant l'icône d'une équipe, une flèche suivante par exemple, bien sûr, maintenant avec les nouveaux frameworks CSS cela pourrait être moins courant, cependant voyons comment c'est fait pour avoir cette option dans notre portefeuille d'outils HTML.
Pour intégrer l'image, nous allons simplement placer l'élément img à l'intérieur d'un élément qui fait référence à une page telle que :
Exemple Voici une forme courante pour représenter les trois activités d'un triathlon.La première icône représente la natation, la seconde représente le cyclisme et la troisième représente la course à pied.
Avec cela, nous réalisons que l'image est maintenant notre lien comme nous le verrons dans l'écran suivant, l'image ne change pas dans la façon dont elle est affichée :
