.ex1 img{
    border: 5px solid #ccc;
    float: left;
    margin: 15px;
    -webkit-transition: margin 0.5s ease-out;
    -moz-transition: margin 0.5s ease-out;
    -o-transition: margin 0.5s ease-out;
}
 
.ex1 img:hover {
    margin-top: 2px;
}

<div class="ex1">
<img src="http://www.rusdigi.org/wp-content/uploads/2011/05/spinning_rays-150x150.png">
<img src="http://www.rusdigi.org/wp-content/uploads/2011/05/spinning_rays-150x150.png">
<img src="http://www.rusdigi.org/wp-content/uploads/2011/05/spinning_rays-150x150.png">
<img src="http://www.rusdigi.org/wp-content/uploads/2011/05/spinning_rays-150x150.png">
</div>