我正在研究一个想法,我的a:链接有一个状态(蓝色,没有下划线等),aa:悬停为白色.我希望我访问过的链接具有相同的状态为a:link和a:hover.这可能吗?大多数常见浏览器都支持?
phi*_*hag 15
a, a:link, a:hover, a:visited, a:active {text-decoration: none; color: blue;}
Run Code Online (Sandbox Code Playgroud)
应该适用于所有支持CSS的浏览器,虽然这是一个坏主意(目前处于离线状态,Google Cache)
要制作a:hover白色,请将其从上述规则中删除并为其制定特殊规则或仅添加:
a:hover {color: white !important;}
Run Code Online (Sandbox Code Playgroud)
Zac*_*man 11
正如sblundy指出的那样,这是完全可能的.但是,如果您制定类似规则,则不再有任何视觉提示,用户将鼠标悬停在之前访问过的链接上.
另外,请记住按此顺序指定规则:
a:link { }
a:visited { }
a:hover { }
a:active { }
Run Code Online (Sandbox Code Playgroud)
否则,您可能会出现意外结果,因为所有这些规则具有相同的特异性.订单很重要.
编辑:CSS2允许将伪类链接在一起.这可用于修复您的请求创建的[潜在]可用性问题.
a:visited:hover { }
Run Code Online (Sandbox Code Playgroud)
但是,我不知道这个公约是否得到广泛支持.
这个助记符我被教导要记住将你的CSS链接放入哪个命令是"LoVe HAte":链接,访问,悬停,活动.
坚持:专注于通常也不是一个坏主意.
当然,如果您通过使用逗号列出选择器来使链接的所有状态看起来相同,那么顺序无关紧要.
以下是如何分别设置 a 标签(正常和已访问)的样式以及悬停的样式。
a
{
color:#6c7492;
font-weight:bold;
text-decoration:none;
}
a:hover
{
border-bottom:1px solid #6c7492;
}
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
25292 次 |
| 最近记录: |