Question

我希望链接在悬停并点击时保持绿色。我编写的代码在它徘徊时起作用，但是当点击链接时它变成蓝色。任何帮助将不胜感激。

HTML code：

<div class="container-fluid">
  <div class="row">
    <div class="col-md-3 text-left topbox">
      <p class="logo">trpti</p>
    </div>

    <div class="col-md-9 topbox home-btns text-center">
      <ul>
        <li> <a href="#"> Sign up </a> </li>
        <li> <a href="#"> About us </a> </li>
        <li> <a href="#"> FAQ </a> </li>
      </ul>
    </div>

 </div>
</div>

CSS代码：

 .topbox {
  background-color: #584B4F;
  height: 55px;
}

.logo {
  color: #EEEAE1;
  font-family: Helvetica;
  font-size: 35px;
  padding-left: 80px;
  letter-spacing: 2px;
}

.home-btns {
  color: #EEEAE1;
  font-family: Helvetica;
  font-size: 15px;
  margin: 0;
  padding: 0;
}

a {
    text-decoration: none !important;
    color: #EEEAE1;
}

a:hover {
  color: #40A97B;
}

a:active {
  color: #40A97B;
}

ul {
  margin-top: 15px;
}

li {
  list-style-type: none;
  display: inline;
  padding: 12px;
}

Answer 1

请试试这个css：

a:focus {
  color: #40a97b;
}

Answer 2

 <div class="col-md-9 topbox home-btns text-center">
      <ul>
        <li> <a href="#" class="active"> Sign up </a> </li>
        <li> <a href="#"> About us </a> </li>
        <li> <a href="#"> FAQ </a> </li>
      </ul>
    </div>

只需在活动链接上添加活动类，这里是活动类的css

a:visited{color: #40A97B;}

一旦点击，锚标签颜色就会变为蓝色

2 个答案: