点击后html链接标签颜色不变答案

【问题标题】：html link tag color not changing after clicked点击后html链接标签颜色不变
【发布时间】：2019-05-31 19:09:24
【问题描述】：

点击后链接颜色没有变化。我使用带有链接的侧面导航栏 css 样式。这是我的 CSS 样式：

我尝试过激活但仍然无法正常工作。

.sidenav 
{
height: 100%;
width: 200px;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: #06799f;
overflow-x: hidden;
padding-top: 20px;
}

.sidenav a 
{
padding: 15px 20px 4px 18px;
text-decoration: none;
font-size: 25px;
color: #f1f1f1;
display: block;
}

.sidenav a:hover 
{
color: #000000;
}

.sidenav a: active
{
color: black;
}

@media screen and (max-height: 450px) {
.sidenav {padding-top: 15px;}
.sidenav a {font-size: 18px;}
}

预计：是点击时链接颜色的变化

【问题讨论】：

你可能想要:visited伪类
是的，但是因为它是一个侧导航栏，所以用户必须知道他们在哪个页面:(
据我所知，您的问题无法用纯 CSS 解决。您需要使用所需的样式将.active 类动态添加到链接中。您可以单独为每个页面手动执行此操作（如果它是静态页面），或者查看类似于Angular 和其他框架提供的路由器选项。这是一个相同的independent 库。还有Scrollspy。

标签： html css web

【解决方案1】：

您必须使用 css 在锚标记中更改访问的颜色，下面给出的例子，

a:visited {
color: #999999;
}

【讨论】：

【解决方案2】：

您可以添加:visited 伪类来设置访问链接的样式。 (Documentation)

.sidenav a:visited {
    color: #BA55D3;
}

按照您的建议使用:active 只会在按下链接时更改颜色。

【讨论】：