Question

编辑：有没有办法更改单击链接的颜色并保持该颜色，直到单击导航栏中的另一个链接？任何人都可以向我提供硬编码的Javascript代码并更改单击的活动链接的颜色吗？

编辑：我还检查了Chrome浏览器中的元素，当我检查元素并查看样式部分时，没有CSS强制点击的活动链接为白色。有没有办法检查是否有这样做的Javascript代码？我不太了解Javacsript代码，所以我不知道该找什么。另外，我如何强制：使用Chrome DevTools激活元素？

基本上，我在网上买了一个网站模板，并有代码。该模板有很多文件，非常基于javascript。所以在导航栏中，如果我点击一个链接，网页就不会改变，布局会发生变化，网页链接也会改变（它会从例如site.com/index转到site.com/contacts）但是实际网页不会改变。此外，导航栏中的链接均为绿色，当我单击链接时，活动链接将呈现白色，而所有其他链接均为绿色。我无法找到代码的这一部分，所以我想知道是否有一种方法可以覆盖适用于标签的所有css规则而只是做

a:avtive {
    color: red;
}

我确实尝试了

a:active {
    color: red !important;
}

但是没有用，它没有做任何事情。

到目前为止，我的代码是

<nav class="menuL">
<ul id="menu">
<li><a href="#!/page_about"><span></span>biography</a></li>
<li><a href="#!/page_portfolio" id="portmenu"><span></span>portfolio</a></li>
<ul id="submenu">
    <li class="subclass" id="first"><a href="#!/page_wine">Wine</a></li>
    <li class="subclass" id="second"><a href="#!/page_landscape">Landscape</a></li>
    <li class="subclass" id="third"><a href="#!/page_divers">Divers</a></li>
</ul>
</ul>
</nav>
<nav class="menuR">
<ul id="menu2">
<li><a href="#!/page_galleries"><span></span>galleries</a></li>
<li><a href="#!/page_contacts"><span></span>contact</a></li>
</ul>
</nav>

Answer 1

更新了jQuery解决方案：

$(document).ready(function() {
  $('nav a').click(function() {
    $(this).closest('nav').find('.activeAnchor').removeClass('activeAnchor');
    $(this).addClass('activeAnchor');
  });
});

然后你需要一些课程的CSS，例如

a.activeAnchor {
  color:red;
}

所以在你的标题中你需要：

<head>
  <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
  <script src="http://link-to-your-jquery-script.js" type="text/javascript"></script>
  <link href="link-to-your-style.css" rel="stylesheet" type="text/css" />
</head>

Answer 2

你应该能够覆盖它们，只要你的CSS在他们的CSS之后，并且只要他们没有在JS中设置硬编码的颜色..我怀疑

a:active {
    color: red !important;
}

！重要不是很好，因为它很难调试

Answer 3

对于所有规则都无法做到这一点 - 如果他们使用JavaScript将某些样式直接应用于元素，则通常情况下无法覆盖它们。

您可以使用Chrome DevTools来识别哪个CSS会生成白色规则。它允许您强制:active元素。如果没有CSS规则，那么可能是用JavaScript完成的。

Answer 4

在链接中查找类属性的链接，它看起来像class =“nav”或其他东西。然后申请。 a.nav：主动{你的风格;} 其中nav是班级

有没有办法覆盖适用于<a> tag</a>的所有CSS规则

4 个答案: