menuitem이 호버 이미지를 표시하지 않음

Question

메뉴 항목에 다음 코드와 함께 호버 이미지 옵션이 표시되지 않습니다. CSS를 올바르게 작성했다고 생각합니다. 제안?

<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'); 
} 

Answer 1

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는 에 base 태그가 지정되어 있지 않으면 문서의 위치가 아니라 스타일 시트의 위치에 상대적입니다.