• Actualité
  • Dossiers
  • Tutos
  • Astuces
  • Télécharger
  • Forums
  • Comparateur
  • Lexique
  • Dico d'extensions
  • Annuaire
Vendredi 21 Novembre 2008 - 16 Connectés

 
Cours HTML

Section 3 - Les Images

Une Page Web avec du seulement du texte peut être jolie mais ennuyeuse. Ajouter des images peut ajouter une dimension supplémentaire.

Avant d'ajouter une image, vous devez être sûr qu'elle est dans un format supporté par le HTML. HTML supporte différents types d'images, mais principalement, le JPEG, le GIF et le BITMAP (BMP).

La taille du fichier est à prendre en considération. Un fichier de taille importante sera plus long à charger et vos "spectateurs" risquent de ne pas avoir la patience d'attendre. En réduisant la taille physique de votre image, cela reduira automatiquement sa taille de fichier sans compromettre la qualité.

Pour insèrer une image, il faut utiliser la balise image (IMG). La source de l'image (SRC) est l'endroit où elle se trouve et le nom de cette image. Une balise image N'A PAS BESOIN de balise fermante.

<IMG SRC='image.gif'>

La balise ci-dessus indique que image.gif se trouve dans le même dossier que test.html. Si l'image se trouve dans un dossier images, lui-même situé dans le même dossier que test.html, la balise ressemblera à ceci : <IMG SRC="images/image.gif">

Vous pouvez également modifier la taille de l'image que vous voulez ajouter à votre page. Définissez la taille et la largeur de l'image comme ceci: < IMG SRC="image.gif "width="300" height="200 ">. L'unité de mesure pour une image est en Pixel. Le HTML reduira les images si elles ne sont pas ajustées à la taille indiquée. Pour empêcher ceci vous pouvez indiquer seulement une taille ou une largeur. Si vous voulez que l'image apparaîsse à taille réelle, n'incluez pas de largeur ou de taille.

Une autre possibilité du HTML est d'inclure dans la balise IMG le parametre ALT. De cette manière un texte apparaitra quand le pointeur de souris passera sur l'image.

Votre pointeur est sur l'image

Si votre image ne s'affichait pas, vous verriez comme ci-dessous à côté du x(qui indique que l'image ne peut pas être trouvée) le nom indiqué dans la paramêtre ALT.

Ajoutons maintenant une image à notre test.html . N'oubliez pas que si vous ajoutez une image, elle doit se trouver dans le même dossier que test.html.

<HTML>

<HEAD>
<TITLE>Ma Page Web</TITLE>
</HEAD>

<BODY>
C'est une photo de mon chat.
<P> <IMG SRC="chat.jpg" ALT="C'est mon chat"> </P>
</BODY>

</HTML>

Cliquez ici pour voir ce que ça donnerait

Peut-être préféreriez vous avoir une image dans le fond de votre Page Web. Le HTML vous permet de changer facilement votre fond blanc en image de votre choix. L'image que vous voulez pour votre fond doit être dans le dossier où vous avez sauvegardé test.html.

L'image de fond s'insere dans votre balise body de la même façon que la couleur de fond

<HTML>

<HEAD>
<TITLE>Ma Page Web</TITLE>
</HEAD>

<BODY BACKGROUND="chat.jpg">
<FONT COLOR="white">C'est pas beau ca?</FONT>
</BODY>

1 | 2 | 3 | 4 | 5 | 6 | 7


  • Appel au Boycott !|
  • Tout savoir|
  • La sclérose en plaques|
  • Services gratuits|
  • e informatique|
  • Annuaire|
  • Partenaires|
  • Informatech|
  • Kit graphique|
  • Moto 50cc|
  • Aidoforum|
  • Blog Maraccuja|
  • Informatruc|
  • Emoticones|
  • Tuto Photoshop|
  • Nourrice Agréée|
  • Tracker|
  • Communauté graphique|
  • Tracker|
  • Yu-Gi-Oh|
  • SAV MSI|
  • Studio Mir, studio d'enregistrement à Montpellier|
  • Cartes3D.com, Au delà du graphisme
  • Ultime shopping