使用 CSS 强制链接看起来未访问答案

【问题标题】：Force link to look not visited using CSS使用 CSS 强制链接看起来未访问
【发布时间】：2020-10-18 15:04:13
【问题描述】：

有没有办法使用 CSS 使给定的链接显示为未访问，即使它已经被访问过？

我知道您可以通过为已访问和未访问的链接显式设置相同的颜色来做到这一点。但是是否可以在不硬编码访问链接的颜色的情况下做到这一点？只是告诉 CSS 使用与未访问链接相同的颜色为它们着色，不管是什么。

这样做的原因是我想和 Rickroll 交个朋友。

【问题讨论】：

好吧，你可以定义a标签，比如：a { color:#0000FF }
有没有办法在不硬编码颜色的情况下做到这一点？
硬编码颜色？它只需要完成一次，所以它不应该那么乏味。
我很好奇是否有独立于基本样式表工作的解决方案。我不知道未访问链接的颜色是什么。

标签： css visited

【解决方案1】：

您可以利用inherit 属性：

a:visited {
  color: inherit;
}

另一种选择是使用!important：

a {
  color: red !important;  
}

【讨论】：

我不确定它是否有效.. jsbin.com/cizuwej/edit?html,css
当我尝试这样做时，它使链接看起来是黑色的，而不是让它看起来是蓝色的。
尝试将body的颜色设置为红色，而不是设置a。
body { color: red; } a:visited { color: inherit; }
我认为没有硬编码颜色的方法可以做到这一点。 CSS visited 标签从一开始就意味着无法访问。例如，Javascript 方法window.getComputedStyle 方法将按字面意思lie 并始终返回非:visited 颜色的值。阅读文档以获取更多信息：developer.mozilla.org/en-US/docs/Web/CSS/:visited

【解决方案2】：

使用 Javascript 的一种解决方案是使用 getComputedStyle 函数获取颜色。这利用了 getComputedStyle 函数总是假装链接是彩色的，就好像它没有被访问过一样（作为一种防指纹措施）。

// Set the colot of a link to the color of a non-visited link
var link = document.getElementById("TheID");
var color = window.getComputedStyle(link).getPropertyValue("color");
link.style.color = color;

【讨论】：