•  

     

    HTML

    <div class="hovergallery6"><img src="https://lh6.googleusercontent.com/-dy6eflBlE2o/VOdyIloF99I/AAAAAAABc4o/lG0DJAbHW1U/w191-h300-no/1-191x300.gif" width="140" height="175" alt=""/><img src="https://lh4.googleusercontent.com/-dMYOACJOvmk/VOimF16A3zI/AAAAAAABc8I/CySivfkfK3Y/w233-h300-no/1-233x300.gif" width="140" height="175" alt=""/><img src="https://lh4.googleusercontent.com/-5XX8QIh9fkg/VOiyH_C-5AI/AAAAAAABc9I/f_J5CAalYRc/w192-h300-no/2-192x300.gif" width="140" height="175" alt=""/></div>

     

    CSS

    <style type="text/css"><!--
    /*GloriaV */
    /*URL: http://tutorialgloriav.eklablog.com/*/
    .hovergallery6 img{ -webkit-transform:scale(1.0);
    border-radius: 5%;
    box-shadow:1px 1px 10px #000;
    border: 1px dotted #000;
    -moz-transform:scale(1.0);
    -o-transform:scale(1.0);
    -ms-transform:scale(1.0);
    -webkit-transition-duration: 0.9s;
    -moz-transition-duration: 0.9s;
    -o-transition-duration: 0.9s;
    -ms-transition-duration: 0.9s;opacity: 0.9; /*Nivel de opacidad de las imágenes*/margin: 0 10px 5px 0; /*Margen entre las imágenes*/

    }.hovergallery6 img:hover{
    margin: 10px 10px 15px 10px;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    box-shadow:3px 3px 10px #000; /*Sombra sobre toda la imagen*
    /
    -webkit-box-shadow:2px 2px 10px #000
    -moz-box-shadow:3px 2px 10px #000;
    -ms-box-shadow:2px 2px 10px #000; opacity: 1
    ;

    }
    --></style>



  • Commentaires

    Aucun commentaire pour le moment



    Ajouter un commentaire

    Nom / Pseudo :

    E-mail (facultatif) :

    Site Web (facultatif) :

    Commentaire :