अभिभावक होवर पर बच्चे div के फ़ॉन्ट रंग बदलना

Question

मेरे पास एक प्रश्न है और मुझे यकीन नहीं है कि यह संभव है, लेकिन मैंने सोचा कि मैं पूछने की कोशिश करूंगा।

कहो मैं तीन div के लिए किया था:

<div id="parent_div"> 

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

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

</div> 

parent_div अंदर सभी पाठ काला करने के लिए सेट है, तो मैं कैसे नीले और लाल को child_div_1 और child_div_2 परिवर्तन फ़ॉन्ट रंग क्रमशः होगा, जब माता पिता div है पर आच्छादित

क्षमा करें अगर यह थोड़ा उलझन में है, लेकिन क्या यह केवल सीएसएस के साथ ऐसा करने का कोई तरीका है?

Answer 1

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

Answer 2

बस माता पिता की :hover राज्य पर आधारित प्रासंगिक बाल तत्वों को लक्ष्य:

/* 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 demo।

Answer 3

पेरेंट तत्व पर :hover छद्म वर्ग का उपयोग करें:

डेमो: http://jsfiddle.net/Guffa/M3WsW/