Comment surligner le texte parent li uniquement sur: hover?

Comment surligner l'article uniquement avec la souris? actuel quand je passe la souris sur l'article il met en évidence tous les articles pour enfants aussi. Est-il possible de mettre en évidence articles seulementComment surligner le texte parent li uniquement sur: hover?

voir exemple ici http://jsbin.com/ubunu/2

<style> 
    li:hover {background:red} 
li li:hover {background:yellow} 
</style> 
</head> 
<body> 
    <p id="hello">Hello World</p> 
    <ul> 
<li>Weblog</li> 
<li>Articles 
    <ul> 
    <li>How to Beat the Red Sox</li> 
    <li>Pitching Past the 7th Inning 
     <ul> 
     <li>Part I</li> 
     <li>Part II</li> 
     </ul> 
    </li> 
    <li>Eighty-Five Years Isn't All That Long, Really</li> 
    </ul> 
</li> 
<li>About</li> 
</ul>

Source

2010-05-21 Jitendra Vyas

Désolé, Bostonian ici. Tu m'as perdu quand tu as mentionné avoir battu les Red Sox. – Robusto

@Robusto - Que voulez-vous dire ??? –

gear-solid: Je plaisante. Mais nous, à Red Sox Nation, prenons la victoire et la perte très au sérieux. – Robusto

Si vous voulez mettre en évidence que « l'article » lorsque la souris est sur le mot, alors vous devrez modifier le code HTML pour ajouter quelques <span> balises ou quelque chose de similaire autour de chaque mot:

<style> 
    li span:hover {background:red} 
    li li span:hover {background:yellow} 
</style> 
</head> 

<body> 
    <p id="hello">Hello World</p> 
    <ul> 
     <li><span>Weblog</span></li> 
     <li><span>Articles</span> 
     <ul> 
     ...etc

EDIT : cela ressemble à un menu - dans ce cas, vous utiliserez des liens, vous pouvez donc les cibler au lieu d'utiliser des intervalles.

Source

2010-05-21 16:54:33 DisgruntledGoat

Vous aurez probablement besoin de jouer avec quelques-uns du positionnement sur les différents navigateurs, mais vous pouvez ajouter ce qui suit à vos styles:

li:hover ul { background: white; } 
li:hover ul li:hover { background: yellow; }

Remplacez «blanc» par la valeur hexadécimale, RVB ou couleur dont vous avez besoin.

Source

2010-05-21 16:37:28 TheQ

+1 oui bonne idée. mais dans ce ul li li: hover montrera jusqu'à si mes moues est sur l'article d'enfant dans ul. mais je pense que c'est la dernière voie possible dans css. –

Voir ma modification, cela aide-t-il? – TheQ

NON Je veux dire que je veux mettre en évidence un seul élément à la fois. –

Comment surligner le texte parent li uniquement sur: hover?

Répondre

Questions connexes