多個懸停狀態的問題 - 不確定相鄰或兄弟選擇器？

Question

它總是讓我不受歡迎的小事。我試圖讓一個導航元素上的懸停效果3個元素。背景顏色，文本顏色和文本下方的小箭頭。

背景顏色很容易，但只有當您將鼠標懸停在實際文本上時，文本顏色纔會發生變化 - 而不是整個塊元素（由背景顏色框起）。另外，我想將圖像下方的小箭頭交換爲圖像。例如：

這裏是網站：

MACI test website

我對鄰近的和同胞選擇讀了 - 但我不能完全得到它做我想做的。這可能很明顯，但目前我看不到它！ 任何幫助，將不勝感激:)

Answer 1

放鏈接，而不是李上着色，使鏈接塊元素，以填補立區：

ul.menu a { 
    display:block; 
    background-color:#FFFFFF; 
} 
ul.menu a:hover { 
    background-color:#AE242A; 
    color:#FFFFFF; 
} 

而且，你可以把箭頭圖像作爲鏈接的非重複背景圖像，併爲常規鏈接和懸停鏈接設置不同的背景圖像。

又一想，你嘗試過：

ul.menu li.nav-links:hover a.nav { 
    color:#FFFFFF; 
}