Como por o efeito de zoom ao passar o mouse na imagem

Curtiu o efeito? Eu também, então veja como fazê-lo.

Tenha em mente que você precisa de um arquivo html com um css já linkado, após ter feito isso, abra o arquivo css e adicione a seguinte classe:

.img-zoom img {
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -o-transition: all 1s ease;
    -ms-transition: all 1s ease;
    transition: all 1s ease;
    max-width: 100%;
}
.img-zoom:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
}

Agora vá no arquivo html e adicione um imagem com a classe img-zoom, como exemplo:

<div class="img-zoom">
<center><img src="Wrath of the Lich King Logo.png" width="400" height="197" alt="WotLK Logo"/></center>
</div>