Eklablog Tous les blogs Top blogs Technologie & Science Tous les blogs Technologie & Science
Editer l'article Suivre ce blog Administration + Créer mon blog
MENU

Tutorial, CSS, HTML

 

 

HTML

<div class="hovergallery5"><img src="https://eCzA" alt="" width="200" height="220" /><img src="http://wgif" alt="" width="200" height="220" /></div>

 



CSS

<style type="text/css">
.hovergallery5 img{ -webkit-transform:scale(0.8);
border-radius: 12pt;
border: 1px dotted #000;
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-ms-transform:scale(0.8);
-webkit-transition-duration: 0.9s;
-moz-transition-duration: 0.9s;
-o-transition-duration: 0.9s;
-ms-transition-duration: 0.9s;opacity: 1; /*Nivel de opacidad de las imágenes*/margin: 2px 3px 3px 2px; /*Margen entre las imágenes*/
box-shadow:1px 1px 7px #000;
}.hovergallery5 img:hover{
-webkit-box-shadow:3px 2px 10px #000;
-moz-box-shadow:3px 2px 10px #000;
-ms-box-shadow:3px 2px 10px #000;
/* Animation Effect - effectRotateInUpLeft */

-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);}
opacity: 0,7;
}
-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);}
opacity: 1;
}
}

-webkit-transform: rotate(160deg);
-moz-transform: rotate(160deg);
-o-transform: rotate(160deg);
transform: rotate(160deg);}
opacity: 0,7;
}
-webkit-transform: rotate(0);
-ms-transform: rotate(0);
transform: rotate(0);
opacity: 1;
}
</style>


Retour à l'accueil
Partager cet article