最近在学习h5:伪类选择器,发现一个问题
在使用a标签的时候,4个状态设定颜色,:link总是不显示,或者被:visited所替代; 如: a:link{color: red;} a:visited{color: green;} a:hover{color:yellow;} a:active{color:gray;} 但是我显示出来是绿色,:link并没有起作用,就算把:visited删掉,:link也没有作用!
在网上查有人说是按照lvha的顺序,但是这个只是为了让hover和active属性起作用而设置的,对于link无作用
具体的原因如下: 只有将应用发布才能看到a:link的效果。如果直接在文件系统中,不会反应a:link
什么意思呢,拿新浪的链接来说,就是在你的浏览器上只要点击过新浪的链接那一刻起,就已经将记录注入到浏览器的缓存中了,所以说,是已经被访问过的链接了,即使链接是之前浏览的,代码是后来写的,在这个浏览器打开link还是不会起作用
如果想让link起作用,就要将浏览器的缓存清除,你可以拿一个新的链接做例子,我这里拿新浪的链接演示一下:
代码实例:
您要想自己测试的话复制下面的就好了
Document
a:link{color:red}
a:visited {color:yellow}
a:hover{color:gray}
a:active{color:blue}
伪类选择器的练习:
注释:在 CSS 定义中,a:hover 必须位于 a:link 和 a:visited 之后,这样才能生效!
注释:在 CSS 定义中,a:active 必须位于 a:hover 之后,这样才能生效!
新浪
浏览器效果:
现在链接显示的是黄色,是因为我之前访问过了,所以下面清除一下最近一个小时浏览器的缓存
不同浏览器清除数据的方式不同,你也可以把所有的数据都清除,我这里就选择了一个小时的 清除之后,再次打开链接看一下效果
新浪的链接变成红色了
你懂了吗?不懂的话,在下方留言,小编会尽力帮你讲解的 如果帮到你了,记得点赞哦!