Gli stili sono commentati
codice:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Zoom</title>
<style type="text/css">
figure, figure img{
 width:300px;/*larghezza delle tue immagini*/
 height:280px;/*altezza delle tue immagini*/
 transition: all 0.5s ease;
}
figure img:hover{
 width:120%;/* ingrandimento del 20% in larghezza */
 height:120%;/* ingrandimento del 20% in altezza */
 margin:-10% 0 0 -10%; /* tiene centrate le immagini */
 
 transform: rotate(7deg);/* ruota l'immagine nell'hover, casomai levalo */ 
}
figure{
 display:inline-block;
 overflow:hidden;
}
</style>
</head>
<body>
<figure>
 <img src="image1.jpg" alt="image 1">
</figure>
<figure>
 <img src="image2.jpg" alt="image 2">
</figure>
</body>
</html>