PHP ver gevorderde |
|
ik heb het ff in css voor je gemaakt:
ul {
list-style: none;
margin: 0;
padding: 0;
}
li a {
background: url(normaal.gif) no-repeat left; /* de afbeelding normaal */
padding-left: 10px; /* de breedte van de afbeelding ervoor + de ruimte die je tussen de afbeelding en de link wilt */
line-height: 10px; /* de hoogte van de afbeelding ervoor */
padding: 5px;
width: 150px;
}
li a:hover {
background: url(hover.gif) no-repeat left; /* de afbeelding als je erover heen gaat */
}
ul { list-style: none; margin: 0; padding: 0; } li a { background: url(normaal.gif) no-repeat left; /* de afbeelding normaal */ padding-left: 10px; /* de breedte van de afbeelding ervoor + de ruimte die je tussen de afbeelding en de link wilt */ line-height: 10px; /* de hoogte van de afbeelding ervoor */ padding: 5px; width: 150px; } li a:hover { background: url(hover.gif) no-repeat left; /* de afbeelding als je erover heen gaat */ }
en de html:
<ul>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
<li><a href="#">link</a></li>
</ul>
<ul> <li><a href="#">link</a></li> <li><a href="#">link</a></li> <li><a href="#">link</a></li> <li><a href="#">link</a></li> </ul>
als het goed is moet dit werken heb het niet getest, want had niet ff snel twee kleine afbeeldingen, maar zou moeten werken |