Menuitems 没有改变，当我将鼠标悬停在 MenuItems 上时。在 Asp.net 上答案

【问题标题】：Menuitems is not changed ,When I hover on MenuItems. on Asp.netMenuitems 没有改变，当我将鼠标悬停在 MenuItems 上时。在 Asp.net 上
【发布时间】：2023-03-25 05:11:01
【问题描述】：

下面的代码有问题。当我将鼠标悬停在菜单项上时，部门Hover 类不会影响菜单项。颜色和背景图像没有改变。

我必须做什么？

P.S 我在环境中使用的是 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>

【问题讨论】：

这可能会帮助你forums.asp.net/t/1053609.aspx/1

标签： c# asp.net .net css

【解决方案1】：

你为什么不直接使用 css hover

.departments:hover
        {
            color:Red;
            padding-left:4px;
            background-color:green;
                background-image:url("tile.jpg");
            width:150px;
        }

【讨论】：

悬停时使用firebug跟踪菜单项的属性。

【解决方案2】：

试试这个方法

<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>

【讨论】：