HTML-Code: 
	#navi {
		background: url(navi.PNG) repeat;
		height: 66px;
		margin: 0 auto;
		position: fixed;
		top: 0;
                left: 0px;
	        width: 100%;
		z-index: 100;<!-- /*Die Navigationsbar schwebt über den Inhalt*/-->

	}
	
	#navi li {
		float: left;
                text-align: center; <!-- /*Positionierung*/-->
	}
	
	#navi li a {
		display: block;
		font-size: 25px;
		height: 10px;
		padding: 20px;
		margin:0px 30px 40px 50px;
		text-shadow: 1px 1px 2px #000;
		text-transform: uppercase;
<!-- /*Der Button*/-->
		
	}
	
	#navi li a:hover {
		background: url(nav1.PNG);
		background-repeat:no-repeat;
		background-position: center;
		color: #fff;
                text-align: center;
<!-- /*Das Bild was hinter dem Button kommt*/-->
	}
	

</style>
</head>
<body>
<!--  Navi  -->
<div class="navi">
<ul id="navi">
			<li><a href="/">Home</a></li>
			<li><a href="/">Game</a></li>
			<li><a href="/">Home</a></li>
		</ul>
</div>
 <!-- Hier habe ich es ins html eingebunden -->
Soweit funktioniert es, jedoch will ich das ich für jeden dieser 3 Links ein anderes background image kommt. Gibt es eine möglichkeit OHNE jetzt für jeden Link die gleiche prozedur zu machen? Ich sitz schon seid 3 Stunden drann. .___.