OUJOOD.COM
La Balise <img> en HTML
La balise <img> est un élément HTML qui permet d'intégrer une image dans un document HTML. Elle est composée de deux attributs obligatoires, l'attribut src et l'attribut alt.
Attribut src
L'attribut src spécifie l'emplacement de l'image à intégrer. Il peut s'agir d'une image stockée sur le serveur du site Web, d'une image stockée sur un autre site Web, ou d'une image stockée localement sur l'ordinateur du visiteur.
Attribut alt
L'attribut alt fournit une description de l'image pour les utilisateurs qui ne peuvent pas la voir, tels que les personnes malvoyantes ou les utilisateurs d'un navigateur qui ne supporte pas les images.
Exemple d'utilisation
<img src="image.jpg" alt="Une image de chat">Cet exemple intègre l'image image.jpg dans le document HTML. L'attribut alt fournit une description de l'image : "Une image de chat".
Autres attributs
La balise <img> prend en charge de nombreux autres attributs qui permettent de personnaliser l'apparence et le comportement de l'image.
- width et height : spécifient la largeur et la hauteur de l'image.
- title : fournit un titre pour l'image.
- align : aligne l'image par rapport au texte.
- border : spécifie la largeur de la bordure de l'image.
- hspace et vspace : spécifient l'espacement horizontal et vertical autour de l'image.
- ismap : permet de convertir l'image en une zone de sélection d'image.
- usemap : spécifie la carte d'image à utiliser pour l'image.
Accessibilité
Les images sont un élément important de la conception Web. Elles peuvent être utilisées pour ajouter de la clarté, de l'intérêt et de l'information à un document HTML. Cependant, il est important de veiller à ce que les images soient accessibles à tous les utilisateurs, y compris les personnes malvoyantes.
Pour rendre les images accessibles, il est important de fournir une description complète et informative de l'image dans l'attribut alt. Cette description doit être suffisamment détaillée pour que les utilisateurs malvoyants puissent comprendre le contenu de l'image.
Conclusion
La balise <img> est un élément HTML essentiel pour l'intégration d'images dans les documents HTML. En utilisant correctement les attributs src et alt, vous pouvez créer des images accessibles et informatives.
Ses attributs
La colone DTD dan l tablau suivant indique dans quel HTML 4.01/XHTML 1,0 DTD l'attribut est autorisé:
S=Strict, T=Transitional, and F=Frameset.
Attributs obligatoires
| Attribut | Valeur | Description | DTD |
|---|---|---|---|
| alt | texte | Spécifie un texte alternatif pour une image | STF |
| src | URL | Spécifie l'URL d'une image | STF |
Les attributs optionnels
| Attribut | Valeur | Description | DTD |
|---|---|---|---|
| align | Top bottom middle left right | Obsolète.Employez les modèles à la place. Spécifie l'alignement d'une image selon les éléments environnants | TF |
| border | pixels | Obsolète.Employez les modèles à la place. Spécifie la largeur de la frontière autour d'une image | TF |
| height | Pixels % | Spécifie la taille d'une image | STF |
| hspace | pixels | Obsolète.Employez les modèles à la place. Spécifie le whitespace du côté gauche et droit d'une image | TF |
| ismap | ismap | Spécifie une image comme imagemap de côté serveur. Rarement utilisé. Regardez l'usemap à la place | STF |
| longdesc | URL | Spécifie l'URL à un document qui contient une description longue d'une image | STF |
| usemap | #mapname | Spécifie une image comme imagemap decôté client | STF |
| vspace | pixels | Obsolète.Employez les modèles à la place. Spécifie le whitespace sur le dessus et le bas d'une image | TF |
| width | Pixels % | Spécifie la largeur d'une image | STF |
Attributs standards
| Attribut | Valeur | Description | DTD |
|---|---|---|---|
| class | nom de classe | Spécifie un nom de classe d'un élément | STF |
| dir | ltr rtl | Spécifie l'orientation du texte pour le contenu dans un élément | STF |
| id | nom de l'id | Spécifie un ID unique pour un élément | STF |
| lang | language_code | Spécifie un code de langue pour le contenu dans un élément | STF |
| style | style_definition | Spécifie un style en ligne pour un élément | STF |
| title | text | Spécifie des informations supplémentaires sur un élément | STF |
| xml:lang | language_code | Spécifies une langue pour le code contenu dans un élément, en XHTML documents Spécifie | STF |
Les attributs de l'événement
| Attribut | Valeur | Description | DTD |
|---|---|---|---|
| onclick | action à exécuter | Script à exécuter sur un clic de souris | STF |
| ondblclick | action à exécuter | Script à exécuter sur une souris double-cliquez sur la souris | STF |
| onmousedown | action à exécuter | Script à exécuter lorsque le bouton de la souris est pressé | STF |
| onmousemove | action à exécuter | Script à exécuter lorsque le pointeur de la souris se déplace | STF |
| onmouseout | action à exécuter | Script à exécuter lorsque le pointeur de la souris sort d'un élément | STF |
| onmouseover | action à exécuter | Script à exécuter lorsque pointeur de la souris sur un élément | STF |
| onmouseup | action à exécuter | Script à exécuter lorsque le bouton de souris est relâché | STF |
| onkeydown | action à exécuter | Script à exécuter quand une touche est pressée | STF |
| onkeypress | action à exécuter | Script à exécuter lorsqu'une touche est enfoncée et relâchée | STF |
| onkeyup | action à exécuter | Script à exécuter quand une touche est relâchée | STF |
Vous êtes ici:Balise IMG Retour à la liste des balises
Retour à l'accueil du site
Par carabde 10 mars 2014