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="hovergallery43"><img src="https://lh3.googleusercontent.com/-05qYa_NHBl8/UwzpucCD3WI/AAAAAAAAChs/3H959MgufyA/w230-h312-no/4.gif" alt="" width="230" height="250" /><img src="https://img-fotki.yandex.ru/get/4513/annaze63.182/0_568be_3a788d0f_orig" alt="" width="230" height="250" /></div>

CSS

.hovergallery43 img{ 
border: 2px solid #fff;
border-radius: 10px;
box-shadow: 2px 2px 6px #000000;
-webkit-transform:scale(0.9);
-moz-transform:scale(0.9);
-o-transform:scale(0.9);
-webkit-transition: width 3s, height 3s, background-color 3s,
-webkit-transform 3s;
transition: width 3s, height 3s, background-color 3s, transform 3s;
opacity: 0.8;
margin:5px 5px 5px 5px;
}
.hovergallery43 img:hover{
box-shadow: 2px 2px 3px 3px rgba(143, 143, 143, 0.3);
border: 1px dotted #000;
border-radius: 20px;
opacity: 1;
-moz-transform: translate3d(5%, -10%, 0); /* center caption */
-webkit-transform: translate3d(5%, -10%, 0);
transform: translate3d(5%, -10%, 0);
-moz-transition: all 0.5s;
-webkit-transition: all 0.5s;
transition: all 0.5s;
-moz-transition-delay: 0.5s;
-webkit-transition-delay: 0.5s;
transition-delay: 0.5s;

}


Retour à l'accueil
Partager cet article
Repost0
Pour être informé des derniers articles, inscrivez vous :
Commenter cet article