1
<!DOCTYPE html>
<html>
<head>
<style>
body {
  font-size: 20px;
}

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #333;
  position: -webkit-sticky; /* Safari */
  position: sticky;
  top: 0;
}

li {
  float: left;
}

li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

li a:hover {
  background-color: #111;
}


.active {
  background-color: #4CAF50;
}

/* Right-aligned section inside the top navigation */
.topnav-right {
  float: right;
}

</style>
</head>
<body>

<div class="header">
  <h2><center>CAMPUS RECRUITMENT SYSTEM</center></h2>
  <!--   <p>**Single stop for all your recruitment destinations.</p>   -->
</div>

<ul>
  <li><a class="active" href="index.php">Home</a></li>
  <li><a href="aboutus.php">About Us</a></li>
  <li><a href="contactus.php">Contact Us</a></li>
  <div class="topnav-right">
  <li><a href="login.php">Login</a></li>
  <li><a href="admin.php">Admin</a></li>
</div>
</ul>




</body>
</html>

请检查代码并帮助我动态更改活动链接的颜色。我不知道该怎么做。我尝试添加一些 java 脚本代码,但没有奏效。

4

1 回答 1

1

您可以使用JS 中的类动态更改a标签的颜色,例如:active

document.querySelector('a.active').style.color = 'red';

但是对于您的特定需要,最好在具有活动伪类的 css 中执行此操作:

a:active {
  background-color: red;  /* choose your color here */
}
于 2020-02-26T17:06:36.057 回答