Un semplice esempio:

La tua pagina:
codice:
<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it" lang="it">
<head>
<title></title>
<style type="text/css">
@import url("stile.css");
</style>
</head>

<body>
<div id="contenitore">
	<div id="roll"></div>
</div>
</html>
Il tuo CSS per i link:
codice:
#roll{
	width: 250px;
	height: 500px;
	border: 1px solid red
}

#roll a{
	background: url(images/bg-roll.gif) 0 0 no-repeat;
	display: block;
	width: 250px;
	height: 500px
	}
#roll a:hover{
	background: url(images/bg-roll.gif) 0 -500px no-repeat;
	}
PS
L'immagine che usi per lo stato "a" e "a:hover" è un'unica immagine di larghezza 250 e altezza 1000; #roll a:hover esegue lo spostamento di questa immagine di sfondo per simulare il rollover