La balise

La balise pour introduire une image dans une page HTML est <img>. Ses principaux attributs sont :

src

src détermine le chemin du fichier image. ce chemin peut être indiqué en partant du répertoire du document, il se présentera alors sous la forme "../../images/fichier.gif". Il peut également être indiqué en partant de la racine principale du site. Il aura alors la forme : "/exemple/images/fichier.gif". Il commencera toujours par /.
La balise minimale pour une image se présente ainsi :

<img src="/images/valid-html401.gif">

height, width

Lorsque vous introduisez plusieurs images sur votre page, vous verrez que lors de l' affichage, elle se met à danser. C' est très desagréable.Cela vient du fait que la taille de l' image n' est pas définie.En plus, cela ralentit l' affichage de la page.
height et width indiquent au navigateur la hauteur et la largeur de l' image (en pixel) qui va être affichée:

<img src="/images/valid-html401.gif" width="88" height="31">

Pour ajuster une image à une dimension précise tout en conservant les proportions, il suffit de préciser soit la hauteur, soit la largeur et automatiquement l' une ou l' autre des dimensions s' alignera sur celle que vous aurez spécifiée.


<img src="/images/valid-html401.gif" width="160" >

alt

Cet attribut permet l' affichage dans une bulle de texte. Lorsque l' affichage de l' image ne se déroule pas correctement, ce même texte apparaîtraà la place de l' image Comme le net devient très fréquenté par les non-voyants, il est important d' utiliser cet attribut pour expliquer l' image Passez la souris sur la première image pour voir s' afficher la bulle. L' image du second exemple est volontairement inexistante pour montrer la manière dont cet attribut s' affiche.

exemple <img src="/images/valid-html401.gif" width="88" height="31" alt="exemple">
exemple <img src="/images/valid-html4011.gif" width="88" height="31" alt="exemple">

longdesc

Cet attribut définit l' adresse d' un document décrivant l' image Pour le moment, je n' ai jamais trouvé d' exemple permettant de comprendre cet attribut.

<img src="/images/valid-html401.gif" width="88" height="31" longdesc="description.txt">

lowsrc

Cet attribut définit l' adresse d' une image à basse résolution.

<img src="/images/valid-html401.gif" width="88" height="31" lowsrc="/images/valid-html401.gif">

name

Cet attribut permet de un nom à votre image. Elle est surtout employée lorsque vous voulez travailler avec du javascript

exemple <img src="/images/valid-html401.gif" alt="exemple" name="Exemple" width="88" height="31" id="Exemple">

border

Cet attribut permet de définir (en pixel) une bordure à votre image.

exemple <img src="/images/valid-html401.gif" alt="exemple" width="88" height="31" border="5">

Elle est assez peu employée sous cette forme.
Lorsque vous utilisez une image comme lien, le navigateur affiche automatiquement une bordure.

exemple <a href="#"><img src="/images/valid-html401.gif" alt="exemple" width="88" height="31"></a>

La définition d' une bordure à 0 pixels permet d' éviter ce cadre disgracieux.

exemple <a href="#"><img src="/images/valid-html401.gif" alt="exemple" width="88" height="31" border="0"></a>

align

La position de l' image dans votre page est déterminé par cet attribut. Deux positions sont fréquemment utilisées seule: gauche ou droite.

exempleessais
<img src="/images/valid-html401.gif" alt="exemple" width="88" height="31" align="left">
exemple
<img src="/images/valid-html401.gif" alt="exemple" width="88" height="31" align="right">


Cet attribut prend vraiment toute son importance lorsque l' image est accompagnée de texte.

Créer un site gratuit avec e-monsite - Signaler un contenu illicite sur ce site