关于CSS中a:link无效以及a:link、a:visited、a:hover、
摘要:有两个标签 a更多免费模板,请访问csshello.com/aa href="www.csshello.com"更多免费模板,请访问csshello.com/a 并且有两个样式 a{ color:blue;}a:link{color:black;} a{ color:blue}是蓝色,a:link{ color:black}是黑色
有两个标签
<a>更多免费模板,请访问csshello.com</a> <a href="www.csshello.com">更多免费模板,请访问csshello.com</a>
并且有两个样式
a{ color:blue;} a:link{color:black;}
a{ color:blue}是蓝色,a:link{ color:black}是黑色,实际显示的颜色是,使用a的是蓝色,使用a:link的是黑色,这说明a:link会对拥有href=”“,即拥有实际链接地址的a对象发生效果。而对直接使用a对象的内容不产生效果。实际上,大多数情况我们直接用a而不是a:link,一般情况下最终效果都会完全相同。
最终运行效果
前者对应的是没有href的a标签,后者是带href的a标签
但是很多时候我们发现a:link设置的样式对链接没有反应,这是因为浏览器存在缓存的问题,你换个浏览器或者清除浏览器缓存就能看到a:link设置的样式是有用的
下面来说一下a:link、a:visited、a:hover、a:active的用法
在使用这些标签的时候我们一定要遵守LVHA这个效果,否则将不能达到你预想的效果,当然a:link和a:visited这两个的位置可以随意。即下面的这种排列顺序
a{ color:blue;} a:link{color:black;} /* 未访问的链接 */ a:visited{ color:red;}/*链接以及点击过的样式*/ a:hover{ color: green;}/*鼠标悬浮在链接上的样式*/ a:active {color:purple;} /* 链接被按下时候的状态,介于hover、visited之间的一个状态 */