cómo hacer zoom en la imagen en el ejemplo de código CSS

Este post ha sido probado por nuestros expertos así se asegura la veracidad de esta reseña.

Ejemplo 1: zoom de imagen css

/*Zoom on hover*/>.zoompadding:50px;background-color:green;transition: transform .2s;/* Animation */width:200px;height:200px;margin:0 auto;.zoom:hovertransform:scale(1.5);/* (150% zoom)*/


"zoom">

/*credits: w3schools.com */

Ejemplo 2: hover reinzoomen css

div.imagewidth:300px;height:200px;overflow: hidden;div.image imgwidth:100%;height: auto;/* SCALE */-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1);/* VERZÖGERUNG */-webkit-transition: all 0.3s linear;-moz-transition: all 0.3s linear;-ms-transition: all 0.3s linear;-o-transition: all 0.3s linear;transition: all 0.3s linear;div.image img:hover-webkit-transform:scale(1.2);-moz-transform:scale(1.2);-ms-transform:scale(1.2);-o-transform:scale(1.2);transform:scale(1.2);

Ejemplo 3: acercar la imagen en html css

/* Point-zoom Container */.point-img-zoom imgtransform-origin:65%75%;transition: transform 1s, filter .5s ease-out;/* The Transformation */.point-img-zoom:hover imgtransform:scale(5);

Sección de Reseñas y Valoraciones

Nos encantaría que puedieras comunicar este tutorial si te ayudó.

---

---

Utiliza Nuestro Buscador