CSS a:hover 保留原始颜色

Question

在其他链接改变颜色的同时，是否可能保持带有类的链接的颜色不变？

例如，我有一个主题，但我希望它支持用户设置的不同颜色。

大多数链接在:hover时会改变颜色，但有些必须保持相同的颜色。

#red是由主题生成的。我想在a.someclass:hover中'继承' a.someclass:link 的颜色

示例：

a:link
{
  color: #red;
}
a:hover {
  color: #black;
}

上面的部分是我无法更改的生成内容。

如下面的答案和评论所建议的，我需要使用jQuery来构建这个内容。

当然，我可以将#red复制到中，但是那样我就必须硬编码颜色，而且由于用户应该能够更改颜色，这不是一个选项。

如果类是someclass，我需要一些东西来覆盖。

- FLY

---

我认为你需要使用JS来完成这个任务。 - maxisam

我刚刚问了一个类似的问题，但是要求使用CSS解决方案，有人提供了一个：https://dev59.com/0nHYa4cB1Zd3GeqPP8lE - Umbrella

所以如果我理解正确，我只需要这样写：a.someclass:hover { color:inherit }？ - FLY

Answer 1

你可以利用currentColor

a.no-color-change:hover {
  color: currentColor;
}

- zurfyx

Answer 2

像maxisam上面说的，你可能需要使用js来实现这个功能。尝试使用jQuery的.hover()或者.mouseover().mouseout()来改变css。当用户切换主题时，你当然需要以某种方式触发这些函数。祝好运。

- Danferth

Answer 3

那为什么不这样做呢？

a:link, a.someclass:hover
{
  color: #red;
}

至少如果我正确理解了你的问题.. 这将确保当悬停时，你的<a>标签和<a class="someclass">标签具有相同的颜色。

- Jules

---

正如我在问题中解释的那样，a:link 的代码是自动生成的，所以我无法更改任何代码。如果那样的话就简单了 ;) - FLY

Answer 4

根据@danferth和@maxisam的建议，这是我的jQuery解决方案 我编写了以下代码以使其工作：

$(document).ready(function(){
   // getting the color before the color is changed ( not sure this is needed )
  var thecolor = $('.article-title').css("color");
  $(".article-title").mouseover(function() {
    // setting the color previously picked
    $(this).css({'color':thecolor});
  });       
});

.article-title 是我想修改链接的类名称

- FLY