Positioning links over Images

Alright, if you go to gmarcade.com (Not my site,) you will notice that the links are positioned over an image. My question is, how do I achieve that?

 

Just implement the image as a background under the text links.

<div style="background:#fff url(someimage.gif) no-repeat">
<a href="#">blahblah</a>
</div>

Code (markup):

 

They've done it by using the img tag, for example:

<a href="#"><img src="imagename.jpg" width="50" height="50" border="0"></a>

Code (markup):

However you can also achieve it by using the css code yangyang provided.

 

I know how to make an image a link. But he has the navigation buttons over it.

Yangyang- How do I position the buttoms around the image, then?

 

<a href="#" style="display:block;height:[image_height]px;width:[image_width]px;line-height:[image_height]px;background-image:url(imagename.png)">The text></a>

Code (markup):

 

Their html and css is a mess so I'll just try my own way.

You can do this with relative or absolute positioning, and probably z-index.