CSS 将 a:visited 链接设置为与 a:link 和 a:hover 相同的状态
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/303440/
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
setting a:visited link to same state as a:link and a:hover
提问by Zack The Human
I'm working on a idea where my a:link have one state (blue, no underline etc) with a a:hover being white. I want my visited links to have the same stateas a:link
and a:hover
. Is this possible? supported in most common browsers?
我正在研究一个想法,我的 a:link 有一个状态(蓝色,没有下划线等),而 aa:hover 是白色的。我希望我访问过的链接具有相同的状态为a:link
和a:hover
。这可能吗?大多数常见浏览器都支持吗?
回答by phihag
a, a:link, a:hover, a:visited, a:active {text-decoration: none; color: blue;}
should work on all CSS-enabled browsers, although this is a bad idea(currently offline, Google Cache)
应该适用于所有支持 CSS 的浏览器,尽管这是一个坏主意(目前离线,谷歌缓存)
To make a:hover
white, either remove it from the above rule and make a special rule for it or add just:
要制作a:hover
白色,请将其从上述规则中删除并为其制定特殊规则或仅添加:
a:hover {color: white !important;}
回答by Zack The Human
It's completely possible as sblundy points out. However, if you make a rule like that there will no longer be any visual cue that the user is hovering over a link that was previously visited.
正如 sblundy 指出的那样,这是完全可能的。但是,如果您制定了这样的规则,将不再有任何视觉提示,表明用户将鼠标悬停在先前访问过的链接上。
Also, remember to specify the rules in this order:
另外,请记住按以下顺序指定规则:
a:link { }
a:visited { }
a:hover { }
a:active { }
Otherwise you may have unexpected results because all of these rules have the same specificity. The order is important.
否则,您可能会得到意想不到的结果,因为所有这些规则都具有相同的特异性。顺序很重要。
EDIT: CSS2 allows the chaining together of pseudo-classes. This could be used to fix the [potential] usability problem your request creates.
编辑:CSS2 允许将伪类链接在一起。这可用于修复您的请求造成的 [潜在] 可用性问题。
a:visited:hover { }
However, I don't know if this convention is widely supported.
但是,我不知道这个约定是否得到广泛支持。
回答by One Crayon
The mnemonic I was taught for remembering which order to put your CSS links in is "LoVe HAte": link, visited, hover, active.
我教过的助记符是“LoVe HAte”:链接、访问、悬停、活动。
Sticking :focus in there is usually not a bad idea, as well.
坚持 :focus 在那里通常也不是一个坏主意。
Of course, if you're making all states of a link look the same by listing selectors with commas, then the order doesn't matter.
当然,如果您通过用逗号列出选择器来使链接的所有状态看起来都相同,那么顺序无关紧要。
回答by Marc Charbonneau
Here's how you can style the a tags (normal and visited) and style the hover separately.
以下是如何设置 a 标签(正常和访问)的样式并分别设置悬停样式。
a
{
color:#6c7492;
font-weight:bold;
text-decoration:none;
}
a:hover
{
border-bottom:1px solid #6c7492;
}
回答by sblundy
If you've using those pseudo classes, I don't see why not.
如果您使用过这些伪类,我不明白为什么不使用。
a:visited, a:hover {
...
}