Hey,
Volgens mij is dit echt een noobvraag maar ik kom er gewoon echt niet uit.
Ik wil zegmaar een <li> klikbaar maken, en het is ook nog eens een plaatje.
Dus ik dacht iets in deze richting;

Code:

     <ul>
       <li id="home"> </li>
      </ul>

En dan deze css;

Code:

#menu li #home, #menu  li #home a:link, #menu li #home a:active, #menu li #home a:visited
{
 background: url('images/home.png') no-repeat;
}
#menu li #home a:hover
{
 background: url('images/home_over.png') no-repeat;
}

Maar dan is hij weer niet klikbaar voor de :hover.
<A href="#home"><li id="home"> </li></a>
Is denk ik ook niet helemaal goed?

je moet het A-element in het LI-element zetten, en dan display: block;

Ik begrijp het niet. Dan zou het er zo uitzien?

Code:

    <ul>
       <li id="home"><a href="#home"> </a></li>
      </ul>

Code:

#menu li #home, #menu  li #home a:link, #menu li #home a:active, #menu li #home a:visited
{
 background: url('images/home.png') no-repeat;
display: block;
}
#menu li #home a:hover
{
 background: url('images/home_over.png') no-repeat;
display: block;
}

Eigenlijk heb ik er best wel haast mee. Dus als iemand het weet, zou ik het heel erg fijn vinden als je het zegt!

zoiets?

html:

Code:

<ul>
<li class="image1"><a href="#"></a></li>
</ul>

En de bijbehorende css:

Code:

ul li.image1 {
width: 500px; // breedte
height: 200px; // hoogte
}
ul li.image1 a{
background-image: url("image1.jpg");
width: 500px; // breedte
height: 200px; // hoogte
display: block;
}
ul li.image1 a:hover{
 background-image: url("image1-hover.jpg"); // hover image
 }

@D Schaap

de 2de hoogte en breedte hoeven niet.

kweet niet of het blok element Anchor de volledige ruimte van de het list item inneemt, zowel dan is het inderdaad niet nodig.

Breedte is automatisch 500px, maar de hoogte moet je wel altijd instellen

Je kunt gewoon een link (dus met de a-tag) in je li's zetten. Dan heb je inprincipe waar je om vraagt. Alleen denk ik dat je ook nog het CSS-gedeelte erbij wilt om er een mooie blokvormige link van te maken die wellicht altijd even breed is. Voorbeeldje voor een net menu:

XHTML:

<ul>
<li><a href="#">linkje</a></li>
</ul>

CSS:

ul {
margin: 0px; padding: 0px; list-style: none;
}

ul li a {
display: block; padding: 5px 0px 0px 10px; height: 16px; font-size: 11px;
}

Ga hier wat mee klooien zou ik zeggen, zit genoeg in om van te leren lijkt me ;-)

Succes ermee!