时间戳

首页 > 解决方案 > 单击后更改A中的颜色

html - 单击后更改A中的颜色

问题描述

我对标题内的菜单有问题 它使文本的颜色变为白色，一切看起来都很好。但是在单击列表中的任何链接后，文本将变为蓝色。它被标记为好像您以前单击过它一样。返回主页后如何停止此命令并将文本恢复为白色。即使刷新页面后它也始终保持蓝色。并且您必须关闭浏览器或更改链接以使颜色恢复为白色。

在图片中你会发现问题。 在此处输入图像描述 在此处 输入图像描述

.list ul{
    list-style-type: none;
    margin: 27px 0px;
}
.list li{
    display: inline;
    margin-right: 55px;
   
}
 .list a:link{
    font-size: 19px;
    text-decoration: none;
    padding: 27px 20px;
    color: #ffffff;
}
.list a:hover{
    background-color: #575757;
}
.list a:active{
    color: #ffffff;
    background-color: #323232;
}
/* gs*/
.list a.gs{
    border: solid 1px #ffffff;
    padding: 11px 20px;
    border-radius: 26px;
    font-size: 17px;
    
}
.list a.gs:hover{
    border: solid 1px #FFAC41;
    background-color: #FFAC41;
    color: #000000;
}
<div class="list">
    <ul>
      <li><a href="#">About</a></li>
      <li><a href="#">The prices</a></li>
      <li><a href="#" class="gs">Get Started</a></li>
    </ul>
  </div>

标签： htmlcss

解决方案

你想要:visited修饰符

.list a:visited {
   color: #ffffff;
}

来源 - https://www.w3schools.com/css/css_link.asp

四个链接状态是：

a:link- 一个正常的、未访问的链接

a:visited- 用户访问过的链接

a:hover- 用户将鼠标悬停在链接上时的链接

a:active- 点击时的链接

推荐阅读