Médiaforma

Redimensionner une image

Print Friendly, PDF & Email

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 ^^