使用我的ASP.net菜單控件創建懸停效果

Question

我的問題：如何使用我的ASP.net菜單創建懸停效果。 問題是，由於標準的ASP.net菜單沒有懸停功能，所以很難/不可能（？）創建。

做功課後，我看到一些人誰使用CSS，jQuery和其他方法嘗試了...但我寧願「正常」的HTML或CSS沒有令人難以置信的複雜的解決方案。 如果真的不可能，有沒有清楚的方法來使用它？

大多數的css選項失敗或者非常複雜。

究竟應該發生什麼： 例如

<asp:MenuItem NavigateUrl="~/Pages/Test.aspx" Text="Test" Value="Test" Selectable="true"></asp:MenuItem> 

的菜單項應該得到因爲對懸停效果不同的背景。

也許將C＃代碼中的CSS更改爲其他內容？

感謝您的回答！

〜〜解決 非常感謝您的幫助！感謝這兩個答案，問題解決了。 我試圖實現該菜單，當我注意到在這個菜單中懸停效果也沒有工作。有什麼問題？我使用2個CSS文件。而且由於第一個css文件包含了關於如何處理a：hover的一些說明，所有其他懸停效果都被忽略。

現在，我知道爲什麼懸停效果不起作用，我可以解決這個問題。非常感謝你們！

Answer 1

好吧，我花了相當長的時間才弄清楚如何使用ASP.net菜單創建懸停效果上的。所以，我發現一個簡單的方法，沒有所有困難的東西或大量的代碼。

如果您在瀏覽器中查看您的asp頁面，請轉至頁面源。當你看到你的菜單，你會發現，它看起來像這樣：

<li> 
    <a class="level1" href="Home.aspx"> 
    <img src="../Images/home.png" alt="" title="" class="icon" />Home</a></li> 
<li> 
    <a class="level1" href="Page2.aspx"> 
    <img src="../Images/homehover.png" alt="" title="" class="icon" />Page2</a><ul class="level2"> 

的解決辦法是改變你的CSS：

a:hover[href*="Home"][class*="level1"] 
{ 
    color: black; 
} 

這片CSS的選擇A元素，其中（在HTML中）屬性href和class包含（或等於）Home和level1。

如果你有更復雜的菜單，那麼我可能會有點不同，因爲我只有2個層次。 （菜單和子菜單） 希望它可以幫助你們！

然後這是我的第一個問題/答案在stackoverflow結束。 感謝您的幫助！

ps：如果它不起作用，請將所有相關css文件中的所有a：hover語句刪除到帶菜單的頁面。如果你使用StaticHoverStyle/DynamicHoverStyle，這也可能是一個問題。