Asp.net 如何使HTML链接显示悬停样式？

我的ASP.NET母版页中有一些HTML标记，表示基本的导航菜单。链接到三页的三个单词。我的CSS和HTML包含在下面供您参考

当我加载页面时，链接以正确的颜色（红色）显示。如果将鼠标悬停在某个链接上，该链接将更改为正确的颜色（蓝色）。到目前为止，我们还不错。单击链接会将链接颜色更改为正确的颜色（黄色）。剩下的两个链接仍然是预期的红色/蓝色。单击第二个链接也会将该链接更改为黄色。现在我有两个黄色链接。两个黄色链接都没有显示我喜欢的悬停颜色（蓝色）。单击第三个链接也会使其变为黄色，并且没有一个链接显示悬停样式

虽然点击了一个链接，但我希望存储颜色并显示悬停颜色。我如何做到这一点？这是一个ASP.NET web应用程序项目，但我现在只使用纯HTML

/* --- css --- */

a:link
{
    color: red;
    text-decoration: none;
}

a:hover
{
    color: blue;
    text-decoration: none;
}

a:active
{
    color: green;
    text-decoration: none;
}

a:visited
{
    color: yellow;
    text-decoration: none;
}



/* --- HTML --- */

<p class="MenuItems">
    <a href="1.aspx">Cars. </a>
    <a href="2.aspx">Trucks. </a>
    <a href="3.aspx">Vans. </a>
</p>

/*--css--*/
a:链接
{
颜色：红色；
文字装饰：无；
}
a:悬停
{
颜色：蓝色；
文字装饰：无；
}
a:主动的
{
颜色：绿色；
文字装饰：无；
}
a:参观了
{
颜色：黄色；
文字装饰：无；
}
/*---HTML--*/

您的

a:hover

声明必须在您的

a:visited

在样式表中声明，因为访问的状态当前具有优先级。始终将鼠标悬停在样式声明块的末尾以防止出现这种情况

a:link->a:visted->a:active->a:hover是最佳顺序。

如上所述，

:hover

声明必须在

:visted

和

:active

声明之后

基本上，在当前样式的级联中，您永远不会看到

：hover

颜色。

只需使用以下选项：

a:hover
{
    color: blue ! important;
    text-decoration: none ! important;
}

或如上所述-使用以下顺序：

a:link
{
    color: red;
    text-decoration: none;
}

a:active
{
    color: green;
    text-decoration: none;
}

a:visited
{
    color: yellow;
    text-decoration: none;
}

a:hover
{
    color: blue;
    text-decoration: none;
}

---

当心！重要的是，尤其是在向用户提供视觉反馈的元素的上下文中-在某些情况下，它们可能与浏览器中用户自己的可访问性设置冲突，从而降低体验。这个“重要信息”还可能覆盖其他地方的声明，这些声明是您不希望被捕获的。在这种特殊情况下，不太可能造成问题，但要解决问题！重要的关键词作为一种不顾一切的最后手段只是一个好习惯。