Changer l'enfant div de couleurs de police du parent hover

J'ai une question et je ne suis pas sûr si c'est possible, mais j'ai pensé que je voudrais essayer de demander.

Dire que j'ai eu trois divisions:

<div id="parent_div">

   <div id="child_div_1">Blue</div>

   <div id="child_div_2">Red</div>

</div>

Si tout le texte à l'intérieur de parent_div est défini sur noir, comment pourrais-je faire la child_div_1 et child_div_2 changer de police-couleur bleue et rouge, respectivement, lorsque la div parent survole?

Désolé si c'est un peu déroutant, mais est-il une façon de le faire de préférence avec CSS?

OriginalL'auteur Arken | 2012-09-27

  1. 34
    #parent_div:hover #child_div_1 {
   color: blue;
}
#parent_div:hover #child_div_2 {
   color: red;
}
    ok, qui fait sens, merci beaucoup!

    OriginalL'auteur Denys Séguret

  2. 7

    Juste cibles pertinentes de l'enfant des éléments basés sur la :hover de l'état de la société mère:

    /* defaults */
#parent_div div {
    color: #000; /* or whatever... */
}

/* hover rules */

#parent_div:hover #child_div_1 {
    color: blue;
}
#parent_div:hover #child_div_2 {
    color: red;
}

    JS Fiddle démo.

    OriginalL'auteur David Thomas

  3. 5

    Utiliser le :hover pseudo-classe sur l'élément parent:

    #parent_div { color: black; }

#parent_div:hover #child_div_1 { color: blue; }
#parent_div:hover #child_div_2 { color: red; }

    Démo: http://jsfiddle.net/Guffa/M3WsW/

    OriginalL'auteur Guffa