quiero que el enlace f1 aparezca en la imagen solo al pasar el mouse sobre la imagen. Intenté esto pero no funciona, el enlace no aparece. alguien puede explicar el problema y escribir un código de trabajo?

 <div class="caine1"> <img src="1.png" width="400" height="250"></img> <a href="#" id="f1">Female</a> </div> #f1 { position:absolute; display: none; z-index: 200; } .caine1 img:hover #f1 { display: inline-block; }