下面的代码有一个问题。当我将鼠标悬停在菜单项上时,departmentsHover类不会影响菜单项。颜色和背景图像不改变。
我必须做什么?
p。我使用的是MS visual Studio 2010和asp.net环境。
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.departmentsHover
{
color:Red;
padding-left:4px;
background-color:green;
background-image:url("tile.jpg");
width:150px;
}
.departments
{
color:Black;
background-color:red;
margin:2px;
padding:4px;
width:100px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Menu ID="Menu1" runat="server" >
<Items>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
</Items>
<StaticMenuItemStyle CssClass="departments"/>
**<StaticHoverStyle CssClass="departmentsHover"/>**
<StaticMenuStyle CssClass="mainmenu" />
</asp:Menu>
</div>
</form>
</body>
</html>
为什么不直接使用css hover
.departments:hover
{
color:Red;
padding-left:4px;
background-color:green;
background-image:url("tile.jpg");
width:150px;
}
试试这个
<asp:Menu ID="Menu1" runat="server" CssClass="departments" >
<Items>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
<asp:MenuItem Text="ada"></asp:MenuItem>
</Items>
</asp:Menu>
和你的风格
<style type="text/css">
.departments:hover
{
color:Red;
padding-left:4px;
background-color:green;
background-image:url("tile.jpg");
width:150px;
}
.departments
{
color:Black;
background-color:red;
margin:2px;
padding:4px;
width:100px;
}
</style>