बूटस्ट्रैप

Question

का उपयोग कर होवर पर आइकन-बार रंग परिवर्तन टॉगल करें, जब आप इसे ओवरवर करते हैं तो मैं .icon-bar क्लास चेंज रंग बनाने की कोशिश कर रहा हूं। मैं का उपयोग कर रंग और आइकन-बार बदलने के लिए टॉगल बटन मिल गया:

.navbar-preheader .navbar-toggle { 
    border: 1px solid white; 
    background-color: transparent; 
    margin-right: 0; 
} 

.navbar-preheader .navbar-toggle:hover { 
    background-color: #4d4d4d; 
} 

.navbar-preheader .navbar-toggle .icon-bar { 
    background-color: white; 
} 

मंडराना कोड मैं का इस्तेमाल किया गया था:

.navbar-preheader .navbar-toggle .icon-bar:hover { 
    background-color: #4d4d4d; 
} 

लेकिन यह मूल रूप से प्रत्येक आइकन-बार रंग बदल रही है, व्यक्तिगत रूप से (नीचे देखें), लेकिन वे सभी रंग बदल एक ही बार में होना चाहिए ...

मुझे यकीन है कि यह कुछ मूर्खतापूर्ण है मैं कर रहा हूँ मीटर जारी करना, लेकिन किसी भी मदद की बहुत सराहना की है। धन्यवाद।

Answer 1

जब पेरेंट तत्व पर मँडरा आप पृष्ठभूमि का रंग बदलने के लिए इच्छुक हैं, इसलिए :hover छद्म वर्ग के रूप में करने का विरोध किया .icon-bar.navbar-toggle के बाद किया जाना चाहिए। दूसरे शब्दों में, आपको चयनकर्ता .navbar-toggle:hover .icon-bar का उपयोग करना चाहिए।

Example Here

.navbar-preheader .navbar-toggle:hover .icon-bar { 
    background-color: #4d4d4d; 
}