Wie setzen Sie CSS hover-Effekt, die auf übergeordnete und untergeordnete Elemente

Sagen wir, ich habe folgenden code:

<div class="wrapper">
  <div class="title"></div>
  <div></div>
</div>

<div class="wrapper">
  <div class="title"></div>
  <div></div>
</div>

<div class="wrapper">
  <div class="title"></div>
  <div></div>
</div>

Auf hover für eine wrapper ich will es Kind Titel div ändern Sie die Hintergrundfarbe.
Kann ich dies in reinem css. In js ich weiß, wie es zu tun. Ich bin daran interessiert, wenn eine Reine CSS-Methode existiert für dieses?

Dank

InformationsquelleAutor Tamás Pap | 2012-01-19
  1. 22

    Ja, Sie können dies tun. Es ist einfach:

    .wrapper:hover .title {
  background-color: #f00;
}

    EDIT:

    Bitte beachten Sie, dass der IE6 erkennt :hover nur auf a-Elemente, so wird dies nicht funktionieren - aber ich hoffe, dass Sie nicht zu verwirren haben mit diesem beschissenen alten Ding.

    • Nur mich zu schlagen, hier ist ein Beispiel: jsfiddle.net/esBrF
    • vielen Dank dafür, ich war nur über das erstellen einer Fiedel mich 😉
    • Danke Jungs 😉 Es funktioniert Super!
    • Vielen Dank für deinen Hinweis. Ungefähr 6-7 Monaten habe ich beschlossen, dass ich nicht über Ie6 nicht mehr. Wenn Sie jemanden verwenden Sie es, er hat es nicht verdient, eine gut aussehende website.
    • du hast Glück - ich aufrecht zu erhalten, einige alte intranet-Websites, auf denen 95% der Nutzer IE6 -.-' (PS: bitte betrachten Sie die Kennzeichnung meiner Antwort, da acceptet, wenn dies die Lösung war, die Sie gesucht haben - und versuchen die Arbeit an Ihrer accept-rate ein wenig mehr, 79% davon abhalten kann, Menschen, die von der Beantwortung Ihrer Fragen)
    InformationsquelleAutor oezi
  2. 4

    was ist das?

    .wrapper:hover .title {
    background-color: blue;
}
    InformationsquelleAutor Marcelo Diniz
Schreibe einen Kommentar