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="hovergallery50"><img src="https://img-fotki.yandex.ru/get/6439/131165231.3d/0_b0713_5c6891ca_orig" alt="" width="230" height="250" /><img src="https://img-fotki.yandex.ru/get/6432/131165231.3d/0_b0714_f73f81b6_orig" alt="" width="230" height="250" /></div>


CSS

.hovergallery50 img{ 
border: 2px solid #fff;
border-radius: 1em 3em /1em 3em;
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;
-moz-opacity: 0.5;
opacity: 0.5;
-khtml-opacity: 0.5;
margin:5px 5px 5px 5px;
}
.hovergallery50 img:hover{
box-shadow: 0 5px 5px -5px rgba(0, 0, 0, 0.9);
border: 1px dotted #000;
border-radius:30%;
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
-khtml-opacity: 1.0;
transform: scale(1.1);
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
transition: opacity 1s;
-moz-transition: opacity 3s;
-webkit-transition: opacity 3.5s;
-o-transition: opacity 3s;
}
Retour à l'accueil
Partager cet article
Repost0
Pour être informé des derniers articles, inscrivez vous :
Commenter cet article