CSS Hover und Hintergrundfarbe

Question

intelligentere Menschen als ich!

Ich habe mein Gehirn für eine Weile mit etwas css für this wordpress website zerbrochen Auf dem Navigationsmenü (Campus, National, Welt, ...) Ich versuche, einige benutzerdefinierte CSS zu tun, wenn Sie die Maus über die Menüpunkte und sie ändern die Farbe. Im Moment werden sie nur schwarz, mit Ausnahme des Campus-Menüpunkts, der sich für einen Moment zu dem ändert, was ich will, und dann zu Schwarz wechselt.

Mein Versuch war es, diese kurze CSS im Stylesheet zu versuchen, aber es hat nicht funktioniert. Ich vermute, dass ich die höher geschachtelten Klassen anpassen muss.

.menu-item-28 a:hover{ 
     background:#1f61c4; 
} 

Dies ist wahrscheinlich eine einfache Frage, aber meine CSS-Fu ist ziemlich schlecht. Jede Hilfe wird sehr geschätzt!

Answer 1

Versuchen Sie, Ihre Wähler auf

#menu-main-navigation li a:hover{ 
     background-color:#1f61c4; 
} 

Dieser jeden Anker zielt Wechsel (a) in Ihrer Hauptnavigation (statt nur des unter .menu-item-28 fand man -. Dh den Campus)

Answer 2

Es gibt diese CSS Regel im Code

#nav nav > ul > li > a:hover { 
    background: #222222; 
    border-color: #222222; 
    color: #fff; 
} 

, die den schwarzen Hintergrund auf Hover verursacht. Das kannst du wahrscheinlich nicht ändern, nehme ich an. Aber wenn Sie eine andere Regel setzen irgendwo „später“ (= darunter) in dem Code, können Sie es mit Ihrer eigenen Hintergrundfarbe überschreiben:

#nav nav > ul > li > a:hover { 
    background: #1f61c4; 
}