menuitem不顯示懸停圖像

菜單項不顯示懸停圖像選項和以下代碼。我相信我已經正確完成了CSS。建議？menuitem不顯示懸停圖像

<asp:Menu ID="mnuMain" EnableViewState="false" IncludeStyleBlock="true" Orientation="Horizontal" runat="server"> 
    <DynamicSelectedStyle CssClass="staticmenu" /> 
    <StaticSelectedStyle CssClass="staticmenu" /> 
    <StaticHoverStyle CssClass="staticmenu_hover" /> 
    <DynamicHoverStyle CssClass="staticmenu_hover" /> 
    <StaticMenuItemStyle HorizontalPadding="20px" /> 
    <Items> 
     <asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home" ImageUrl="~/i/nest.jpg" Selected="true" /> 
     <asp:MenuItem NavigateUrl="~/About.aspx" Text="About" ImageUrl="~/i/nest.jpg" /> 
    </Items> 
</asp:Menu> 


.staticmenu 
{ 

} 

.staticmenu_hover 
{ 
    background-image:url('/i/bird_popup.gif'); 
}

來源

2014-01-23 muybn

你可以添加輸出的HTML嗎？我不確定ASP如何將ImageUrl參數添加到元素。如果它使用內聯樣式，那麼它將始終覆蓋您的外部CSS。如果它是一個img元素，那麼你的背景圖像風格將沒有可見的效果。 – justis

我不確定ASP如何將ImageUrl參數添加到元素。但是，如果它使用內聯樣式，那麼它將始終覆蓋您的外部CSS，並且如果它是img元素，那麼您的background-image樣式將沒有可見的效果。

我建議既包括圖像作爲background-image風格在你的CSS，並可能使用純CSS來管理圖像狀態，所以它會看起來更像是這樣的：

.staticmenu 
{ 
    background-image:url('/i/nest.jpg'); 
} 

.staticmenu:hover 
{ 
    background-image:url('/i/bird_popup.gif'); 
}

還要注意在圖像的URL您的CSS將與樣式表的位置相關，而不是文檔的位置（除非在head中指定了base標籤）。

來源

2014-01-23 21:36:19 justis

menuitem不顯示懸停圖像

回答

相關問題