使元素与默认锚链接颜色相同答案

【问题标题】：Make element same color as default anchor link使元素与默认锚链接颜色相同
【发布时间】：2014-05-04 22:47:55
【问题描述】：

是否可以使用 CSS 使元素的颜色与默认的<a> 颜色相同？

如果有，怎么做？

【问题讨论】：

元素{颜色：蓝色；这不起作用吗？
@GCyrillus：不过，默认的a 颜色并不是真正的blue。无论如何，不是在每个浏览器中。
@BoltClock 对，也取决于 a, a:link,a:visited :)
我想我可能需要为链接选择一种“默认”颜色，并将它们分配给普通链接和我想要的元素。我可能会使用stackoverflow.com/questions/4774022/… 作为默认值。
唯一的解决办法是用一个假的a 元素包裹你的元素。

标签： css

【解决方案1】：

我认为没有关键字可以将颜色指定为与链接相同的颜色（尽管我们确实有关键字可以指定系统颜色）。唯一的解决方法是使用脚本构建一些 CSS 规则，将颜色设置为与链接相同的颜色，并将此样式用于您的元素。

//Get the default link color in the current browser
var a = $("<a href='#'>").appendTo('body');
var linkColor = a.css('color');
a.remove();
//build the CSS rule 
var ss = document.styleSheets[0];
if('addRule' in ss) {
  ss.addRule(".defaultLinkColor", "color: " + linkColor);
} else if('insertRule' in ss){
  ss.insertRule(".defaultLinkColor { color: " + linkColor + ";}", 0);  
}

然后你可以为你的元素应用 defaultLinkColor 类：

<span class='defaultLinkColor'>I'm not a link</span>

Demo.

【讨论】：

有趣的方法。适用于 Chrome，但不适用于 FF29
@user1032531 这是因为FF 不（也许从不）支持addRule 方法，它只支持insertRule 方法。我更新了代码和演示。
那是因为addRule() 是非标准的。出于互操作的原因，除了 insertRule() 之外，大概 Chrome 还支持它。
一种更简单的跨浏览器方式（当您仍然使用 jQuery 时）是直接在元素上设置属性：$('.defaultLinkColor').css('color', linkColor);。
@JukkaK.Korpela 是的，但它的工作方式不同，任何新创建的元素都应该使用该行代码更改样式。