Hover-Effekt nur für ausgewählte Kinder

Question

Ich weiß, dass, wenn ich in einem einen Hover-Effekt auf alle divs anwenden möge gut ich diesen Code verwenden:

.well:hover div { 
 
    background-color:green 
 
}

Aber jetzt will ich Wende den Hover-Effekt nur auf divs an, die ich in diesem Well haben möchte. Wie kann ich sie angeben? Ich habe versucht, so etwas wie dieses:

.well:hover div1,div2,div9 {}

aber das scheint nicht richtig. Wie es geht?

Answer 1

Wenn Komma, jeder Eintrag ist ein separater Schalter:

So sollten Sie es tun so: .well:hover div1, .well:hover div2, .well:hover div9 { /* your styles here */ }

Sofern Sie keinen Präprozessor verwenden, kann dieser nicht verkürzt werden.

Answer 2

Vielleicht lese ich dieses Recht nicht, aber Sie würden einfach .well div:hover als CSS-Selektor verwenden, um einzelne Hover-Effekte auf diese divs anzuwenden.

Answer 3

eine Klasse zu den divs hinzufügen innerhalb der gut Sie beeinflussen möchten und dann auf CSS hinzufügen:

.well .my-hover-class:hover { 
    /// do something 
}