WebPetit

L’ élément HTML img permet d’insérer une image.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attributs

Attribut : src

Permet de spécifier l’url de l’image à rajouter.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attribut : height

Permet de spécifier la hauteur de l’image.
Elle est renseigné en pixel(px), point(pt), pourcentage(%), ou en em.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" height="50px" />

Attribut : width

Permet de spécifier la largeur de l’image.
Elle est renseigné en pixel(px), point(pt), pourcentage(%), ou en em.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" width="50px" />

Attribut : alt

Il permet d’afficher un texte alternatif par exemple lorsque des problèmes de chargement surviennent sur l’image.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png"  alt="logo php" />

Attribut : class

Permet de spécifier la classe css à utiliser sur l’image.

<img class="image" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

.image{
border:5px solid chocolate;
}

Attribut : id

Permet de spécifier l’identifiant css à utiliser sur l’image.

<img id="image" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

#image{
border:5px solid yellow;
}

Attribut : title

Permet de mettre une infobulle sur le corps de la page HTML.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png"  title="logo php" />

Attribut : dir

Permet de spécifier le sens d’écriture du texte. Elle prend 2 valeurs :
- ltr : Left To Right : de gauche à droite(valeur par défaut).
- rtl : Right To Left : de droite à gauche.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" dir="rlt" />

Attribut : style

Permet d’appliquer un style sur l’image directement dans le html, sans avoir besoin d’une feuille de style.

<img style="border:5px solid black;" src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" />

Attribut : lang

Permet de spécifier la langue à l’intérieur de l’image.

<img src="http://www.web-petit.com/wp-content/uploads/Logo-PHP.png" lang="en" />