Html 访问时禁用锚标记的颜色更改
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7291873/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable color change of anchor tag when visited
提问by popcoder
I have to disable the color change of an anchor tag when visited. I did this:
我必须在访问时禁用锚标记的颜色更改。我这样做了：
a:visited{ color: gray }
(The link is gray in color before visited.) But this is a way where I explicitly state the color after the link is visited, which is again a color change.
（链接在访问之前是灰色的。）但这是我在访问链接后明确声明颜色的一种方式，这也是颜色变化。
How can I disable the color change of an anchor tag when visited without doing any explicit color changes?
如何在不进行任何显式颜色更改的情况下在访问时禁用锚标记的颜色更改？
回答by Ryan
If you just want the anchor color to stay the same as the anchor's parent element you can leverage inherit:
如果您只是希望锚点颜色与锚点的父元素保持相同，您可以利用继承：
a, a:visited, a:hover, a:active {
color: inherit;
}
Notice there is no need to repeat the rule for each selector; just use a comma separated list of selectors (order matters for anchor pseudo elements). Also, you can apply the pseudo selectors to a class if you want to selectively disable the special anchor colors:
请注意，无需为每个选择器重复规则；只需使用逗号分隔的选择器列表（锚伪元素的顺序很重要）。此外，如果您想有选择地禁用特殊锚点颜色，您可以将伪选择器应用于类：
.special-link, .special-link:visited, .special-link:hover, .special-link:active {
color: inherit;
}
Your question only asks about the visited state, but I assumed you meant all of the states. You can remove the other selectors if you want to allow color changes on all but visited.
你的问题只询问被访问的州，但我认为你的意思是所有的州。如果您想允许所有未访问的颜色更改，您可以删除其他选择器。
回答by Rich Bradshaw
You can't. You can only style the visited state.
你不能。您只能设置访问状态的样式。
For other people who find this, make sure that you have them in the right order:
对于发现此问题的其他人，请确保按正确顺序放置它们：
a {color:#FF0000;} /* Unvisited link */
a:visited {color:#00FF00;} /* Visited link */
a:hover {color:#FF00FF;} /* Mouse over link */
a:active {color:#0000FF;} /* Selected link */
回答by Rob Lokhorst
For :hoverto override :visited, and to make sure :visitedis the same as the initial color, :hovermust come after :visited.
对于:hover覆盖:visited，并确保:visited与初始颜色相同，:hover必须在 之后:visited。
So if you want to disable the color change, a:visitedmust come before a:hover. Like this:
所以如果你想禁用颜色变化，a:visited必须在a:hover. 像这样：
a { color: gray; }
a:visited { color: orange; }
a:hover { color: red; }
To disable :visitedchange you would style it with non-pseudo class:
要禁用:visited更改，您可以使用非伪类对其进行样式设置：
a, a:visited { color: gray; }
a:hover { color: red; }
回答by Kyle
Either delete the selector or set it to the same color as your text appears normally.
删除选择器或将其设置为与您的文本正常显示相同的颜色。
回答by Smagin Alexey
I think if I set a color for a:visitedit is not good: you must know the default color of tag aand every time synchronize it with a:visited.
我觉得如果我给a:visited它设置一个颜色是不好的：你必须知道标签的默认颜色，a并且每次都与a:visited.
I don't want know about the default color (it can be set in common.cssof your application, or you can using outside styles).
我不想知道默认颜色（它可以在common.css您的应用程序中设置，或者您可以使用外部样式）。
I think it's nice solution:
我认为这是一个很好的解决方案：
HTML:
HTML：
<body>
<a class="absolute">Test of URL</a>
<a class="unvisited absolute" target="_blank" href="google.ru">Test of URL</a>
</body>
CSS:
CSS：
.absolute{
position: absolute;
}
a.unvisited, a.unvisited:visited, a.unvisited:active{
text-decoration: none;
color: transparent;
}
回答by VooDoo
You can solve this issue by calling a:linkand a:visitedselectors together. And follow it with a:hoverselector.
您可以通过同时调用a:link和a:visited选择器来解决此问题。并用a:hover选择器跟随它。
a:link, a:visited
{color: gray;}
a:hover
{color: skyblue;}
回答by Moliere
Use:
用：
a:visited {
text-decoration: none;
}
But it will only affect links that haven't been clicked on yet.
但它只会影响尚未点击的链接。
