2010-02-17 6 views
0

Lorsque jeélément parent à l'aide CSS

<ul class="menu"> 
<li><a href="bla">link</a></li> 
</ul> 

comment puis-je faire le changement LI-tag une propriété (par exemple la liste de style-image) quand est plané (a: hover)?

Répondre

3

Vous pouvez appliquer hover au li ainsi:

ul.menu li:hover 
{ 
    list-style-image: url(highlight.gif); 
} 

Note (Merci à Andy E): :hover est pas pris en charge dans IE6 et pris en charge pour les liens que dans IE7. (Voir le tableau de compatibilité here). Il existe une solution de contournement pour IE6 et 7 nommé whatever:hover.

+0

+1. Pour IE6 ou d'autres navigateurs incompatibles, vous devez obtenir cela en javascript. –

+0

http://www.xs4all.nl/~peterned/csshover.html ce gars-là a déjà fait le travail pour vous. Je l'ai utilisé à bon escient. – Mauro

+0

@Andy E Cheers pour me le rappeler, édité ma réponse. @Mauro: même lien en même temps :) –

1

Sur les navigateurs modernes, vous pouvez utiliser li:hover mais les plus anciens, vous devez utiliser javascript.

Edit: Soit dit en passant, si vous définissez:

a { 
    display:block; 
} 

vous pouvez faire tout le style de la a et vous ne pas besoin de style de la li.

0

Vous pouvez donner ajouter directement dans l'élément d'ancrage qui est un élément sous l'élément li

li a:hover { ..style.. } 

Ou vous pouvez ajouter une classe pour l'ancre pour le faire

li a.HoverClass:hover { ..style.. } 

Il est un exemple de base here

Questions connexes