/*<div class="caja">
<a href="referencia a donde va">
<img src="url-imagen">
<span class="info" style="font-size: 12px;">
texto
</span></a></div> */

.caja {
position: relative; /*Para poder ubicar la info dentro de la caja*/
margin: 10px auto;
}
.caja img {
border:2px solid black;
}
.info {
position: absolute; /*Info sobre la imagen*/
top: 0%;
left: 15%; /*Desplazamos a partir de la esquina superior izquierda*/
zoom: 1;
filter: alpha(opacity=0); /*Opacidad Para IE */
opacity: 0; /*Inicialmente transparente */
padding: 5px;
color: black;
background: white;
-moz-transition:all ease .8s; /*Aplicamos una ligera transición*/
-webkit-transition:all ease .5s ;
transition:all ease .8s;
}
.caja:hover .info {
filter: alpha(opacity=95);
opacity: .95; /*Al hacer hover sobre la caja hacemos  visible los dato s*/
}