ICI header("Location: http://www.mytesting.fr ");
TESTS ET ASTUCES DE BLOGUEUR

Comment tronquer une image sans modifier les proportions.

par André Marini 21 Mai 2015, 09:57 Images

Pour tronquer une image en conservant ses proportions, on procède ainsi:

 

1)-Affichage de l'image réelle : 

 

CODE


<img src="http://img.over-blog-kiwi.com/1/30/51/51/20150420/ob_ccbc1f_oeufs.jpg" 
   style="height:375px; width:500px;" /> 

 

RESULTAT

2)-Affichage de l'image obtenue avec l'application de la propriété clip :

 

CODE


<img src="http://img.over-blog-kiwi.com/1/30/51/51/20150420/ob_ccbc1f_oeufs.jpg"
   style="position:absolute; height:375px; width:500px; clip:rect(10px,250px,300px,10px);" />

 

On remarque plusieurs choses

-Le style est désigné en position "absolute".

Les dimensions de l'image restent identiques mais elles serviront de cadre.

-On introduit la propriété clip avec 4 valeurs:

1 MARGE DU HAUT

4 MARGE DE GAUCHE

2 HAUTEUR

3 LARGEUR

 

RESULTAT

Haut de page

Theme: Autofocus © 2013 - Hébergé par Overblog