ASP.NET/CSS - 无法获得 :active to work

Question

我的母版页中有一个菜单栏，它由 4 个带有背景图像的超链接组成，这些超链接是使用 css 设置的。在悬停时，这些图像也会被 css 换出。所以每个菜单项(超链接)都有两个图像，一个静态图像和一个悬停图像。当用户单击其中一个菜单项并转到该页面时，我希望将悬停图像“粘贴”到该页面。这是我的代码:

<div id="nav">
    <asp:HyperLink ID="hlHome" runat="server" 
            NavigateUrl="~/Default.aspx" CssClass="menuHome" />
</div>

 #nav a, #nav a:visited
{
    height:39px;
    border:none;
    padding:0;
    display:block;
    cursor:pointer;
}

a.menuHome, a.menuHome:visited
{
    width:76px;
    height:39px;
    background:url('home.gif');
}

a.menuHome:hover, a.menuHome:active
{
    width:76px;
    height:39px;
    background:url('home_hover.gif') no-repeat;
}

我的超链接背景图片正在渲染，鼠标悬停效果也有效，我只是无法让鼠标悬停图像“固定”/保持事件状态。有帮助吗？

Answer 1

一个选择(我觉得肯定会有更好的选择)是增加一门课，也许是activepage然后将此类添加到每个页面上的事件菜单项中。 您可以尝试在页面加载时动态执行此操作。这activepage类可以有一个包含 background:url('home_hover.gif') no-repeat; 的 css 条目

如果您不知道，可以在单个 html 元素上设置多个类标识符，方法是用空格分隔，例如:<a href="foo.html" class="activepage menuHome">