Question

我在我的网页中使用锚标记作为菜单项。我使用css设计锚标签，如菜单外观。我的页面上有三个锚标记。

我的css设计如下 -

 div.menu
{
 margin:0px;  
height:30px;
background-color:Gray;
}
span.menu a:link
{
    display:inline-block;
    font-weight:bold;
    color:#0000CC;
    background-color:#E8EEFD;
    text-align:center;
    padding:4px;
    text-decoration:none;
    width:70px;
    padding:5px;
    margin:0px;  
}
span.menu a:visited
{
    display:inline-block;
    font-weight:bold;
    color:#0000CC;
    background-color:#D3D5EB;
    text-align:center;
    padding:4px;
    text-decoration:none;
    width:70px;
    padding:5px;
    margin:0px;  
}
span.menu a:hover
{
    background-color:#D3D5EB;
}

上面是我对锚标签的css设计。我想在点击标签后更改背景颜色＆amp;颜色应该保持到菜单项的下一个选择。我试过扔上面的CSS。但它在设置后显示了相同的背景颜色：访问过的样式。

当我运行我的页面时，它最初显示我访问的颜色＆amp;不是链接颜色。

如何解决这个问题？

感谢。

Answer 1

你无法做到：访问过。它适用于您之前打开的所有链接，而不仅仅是单击。

例如：如果您在链接中定位http://google.com，那么如果浏览器记住您过去访问过google.com，则会应用：访问过该链接的样式。（即使您从未点击此特定链接）

要在菜单中指明所选项目，您需要按照上面的建议对其应用另一个类别。例如，将类设置为“current”并将其应用于当前链接。

Answer 2

您必须使用JavaScript设置或交换样式类才能实现此目的。这是jQuery（http://api.jquery.com/toggleClass/）中的一个示例，您也可以使用纯JavaScript。

document.getElementById("MyElement").className += " MyClass";

锚点标记背景在a：悬停后更改，但在访问链接后不会停留

2 个答案: