Como usar o efeito de zoom da imagem no CSS
.parent:hover .child,
.parent:focus .child {
transform: scale(1.2);
}
Open Owl
.parent:hover .child,
.parent:focus .child {
transform: scale(1.2);
}/* Point-zoom Container */.point-img-zoom img { transform-origin: 65% 75%; transition: transform 1s, filter .5s ease-out;}/* The Transformation */.point-img-zoom:hover img { transform: scale(5);}.parent {
width: 400px;
height: 300px;
}
.child {
width: 100%;
height: 100%;
background-color: black; /* fallback color */
background-image: url("images/city.jpg");
background-position: center;
background-size: cover;
}