更改鼠標懸停時圖像映射的背景

Question

在我的網站中，我有一個圖像作爲導航欄，並創建了熱點將它們鏈接到不同的頁面。問題是因爲文本是圖像的一部分，我無法改變懸停文本的樣式。儘管我希望文本/熱點在鼠標懸停時突出，所以我瞭解背景顏色可以在鼠標懸停時更改。那可能嗎？有沒有辦法在CSS中使用該區域或地圖。如果要使用Javascript，有人可以幫我解決這個問題。

Answer 1

你有使用單個圖像作爲導航欄的原因嗎？

而不是一個單一的熱點圖像，我會爲每個導航鏈接使用一個單獨的圖像。這樣，您可以輕鬆地在懸停時更改圖像（或使用CSS圖像定位）。這說明如下：

http://css-tricks.com/video-screencasts/7-three-state-menu/

以及許多其他地方，我敢肯定。

Answer 2

我不認爲這是一個好主意，既不使用圖像映射也不使用單個圖像。

取而代之的是，使用CSS sprites：單個圖像文件，將其作爲背景圖像添加到菜單鏈接，但將背景圖像置於不同的位置。有關更多信息，請參閱this Line 25 tutorial。