Médiaforma

Redimensionner une image

Print Friendly

Lorsqu’une page Web contient des images, il est très important de bien choisir leur format et leur taille pour minimiser leur poids et donc le temps nécessaire à leur affichage dans le navigateur. Si vous le souhaitez, il est possible de redimensionner une image en utilisant les attributs height et/ou width dans la balise <img>. Mais attention, si vous utilisez ce procédé pour redimensionner une image de grande taille, elle mettra autant de temps à se charger. En effet, le redimensionnement est effectué une fois l’image téléchargée.

Dans cet exemple :

  • La ligne 6 affiche l’image originale.
  • La ligne 7 redimensionne l’image en agissant sur sa hauteur. La largeur est ajustée en conséquence.
  • La ligne 8 redimensionne l’image en agissant sur sa largeur. La hauteur est ajustée en conséquence.
  • La ligne 9 modifie la hauteur et la largeur de l’image. Comme vous le voyez, l’image est déformée.

Vous avez aimé cet article ? Partagez-le avec vos réseaux...
 
Comments

J’utilise ça: http://www.pimenteo.com/labo/html5-redimensionner-image/ , c’est en ligne et gratuit. Découvert sur twitter ^^

Leave a Reply