如何使链接在访问后不改变颜色？

Question

我有这段 CSS：

a:visited 
{
    text-decoration: none;
    decoration: none; 
}

链接被访问后会改变颜色。

这正发生在本页面右侧底部的“浏览所有问题”链接上：http://www.problemio.com

谢谢！

- GeekedOut

Answer 1

文字装饰影响下划线，而非颜色。

要将已访问链接的颜色设置为与默认颜色相同，请尝试：

a { 
    color: blue;
}

或者

a {
    text-decoration: none;
}

a:link, a:visited {
    color: blue;
}

a:hover {
    color: red;
}

- Matt Stauffer

---

这段代码不能阻止链接改变颜色，它会强制将其设为已知的相同颜色。如果你不知道颜色是什么，只想让链接忽略访问，则无法使用此代码。 - Seph Reed

Answer 2

为避免重复编写代码，我建议您同时定义两种状态下的颜色：

a, a:visited{
     color: /* some color */;
}

确实，这将使您的 <a> 颜色（无论此颜色是什么）保持不变，即使链接已被访问。

请注意，如果 <a> 内部元素的颜色正在被继承（例如，颜色在 body 中设置），则可以使用以下技巧：

a, a:visited {
    color: inherit;
}

- eversor

---

但是继承从哪里继承呢？最近的外部元素？现在它搞乱了右侧链接 :) - GeekedOut

不是这样的。Inherit并不继承<a>标签的颜色，而是继承了父元素的颜色。这将会产生完全意想不到的结果。请参考这个示例：http://codepen.io/mattstauffer/pen/yvnfc - Matt Stauffer

Answer 3

只需给它加上CSS颜色

例如：

a
{
 color:red;
}

- Royi Namir

---

我已经长时间使用 a, a:visited { color: red; }，但我现在考虑只使用 a { color: red; }。它似乎可以很好地覆盖浏览器默认的 a:link 和 a:visited。如果你在定义 :visited 后，每次需要更具体的选择器时都需要重新定义它，例如 .my_class aside a, .my_class aside a:visited {} 等等。 - squarecandy

Answer 4

对于所有锚点标签的应用，请使用

CSS

a:visited{
    color:blue;
}

如果只想应用在某些锚点上，请使用以下方法：

CSS

.linkcolor a:visited{
    color:blue;
}

HTML

<span class="linkcolor"><a href="http://stackoverflow.com/" target="_blank">Go to Home</a></span>

- BlackHat

Answer 5

您可以使用不同的类：

例如：

.clase
{
text-decoration-color: none;
color: #682864;
text-decoration: none;

}
.clase2:hover
{
color: white;
text-decoration: none;
}

 <a href="#" class="clase2 clase"> link que no tiene subrayado ni color standar</a>

- anaid JimMor

Answer 6

类似以下代码应该可以实现：

a, a:visited { 
    color:red; text-decoration:none; 
    }

- James Johnson

Answer 7

如果您想将特定链接的颜色设置为新的颜色或防止在访问后更改其颜色，请在该链接的标签中添加以下内容：

<a style="text-decoration:none; color:#ff0000;" href="link.html">test link</a>

上面的颜色是 #ff0000，但你可以将它改为任何你想要的颜色。

- wiztrail

Answer 8

a:visited
{
color: #881033;
}

（或者您想要的任何颜色）

text-decoration 用于下划线（上划线等）。 decoration 不是有效的 CSS 规则。

- MiDo

Answer 9

(Header CSS:)

<style>

a  {   
   color: #ccc;   /* original colour state*/
}

a:active {
   color: #F66;  
}


a[tabindex]:focus {
    color: #F66;
    outline: none;
}

</style>


(Body HTML:)

<a href="javascript:;" style="font-size:36px; text-decoration:none;"  tabindex="1">click me &#9829;</a>

- TryThis