博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
小议常被忽略的a标签:visited属性的特殊用法
阅读量:5784 次
发布时间:2019-06-18

本文共 895 字,大约阅读时间需要 2 分钟。

CSS1/CSS2对于a定义了4个伪类,

:link  a标签未访问时的样式

:active  a标签mousedown时的样式

:hover  a标签mouseover时的样式

:visited  a标签访问过之后样式

对于hover属性,当然是最常用的,恰恰相反的与之对应的就是visited属性,基本很少有人提及。

a:visited从使用意义来说,是指用户访问过某一个链接之后,该链接的a标签将呈现对应:visited属性定义的样式。

这里的重点在于链接,经过测试发现

                                    test1        test2        test3    

 

点击a1之后的同时,a2也会应用visited的样式,但是a3不会。

可以得出这样的结论,a:visited是与URL有关,而与单个的a标签无关

利用这点,我们可以大胆的做一下尝试。

应用场景A:

对于一个抽奖应用,按钮点击过一次之后,下方给予提示“您已参加过抽奖”

    

 

效果如下

点击之后,

只要url相同,且被浏览器访问过,我们就可以使用a:visited做容器,在页面的任何位置,做各种展示效果。

 

应用场景B:

利用a:visited只依赖于URL的特点,我们还可以实现,隐私收集这样的功能。

    

 

只要用户的机器访问过比如,访问该页面时候,就会利用background-image发送xxxxx.jpg#taobao这样的请求,这样服务端,就可以通过hashid收集并统计用户的访问历史记录了。

 

这里google.com因为访问的是google.com.hk,所以没有请求,只有#taobao一个访问记录。

转载:http://www.cnblogs.com/xueduanyang/archive/2010/11/09/1873110.html

你可能感兴趣的文章
VC中实现文字竖排的简单方法
查看>>
会话标识未更新
查看>>
阿里架构师:程序员必须掌握的几项核心技术能力
查看>>
程序员常用的六大技术博客类
查看>>
Iceworks 2.8.0 发布,自定义你的 React 模板
查看>>
胖哥学SpringMVC:请求方式转换过滤器配置
查看>>
Kotlin 更加优雅的 Builder - 理解 with
查看>>
前端日拱一卒D6——字符编码与浏览器解析
查看>>
深入理解浏览器的缓存机制
查看>>
微软向Linux社区开放60000多项专利:对开源微软是认真的
查看>>
Hoshin Kanri在丰田的应用
查看>>
又拍云沈志华:如何打造一款安全的App
查看>>
克服大数据集群的挑战
查看>>
PostgreSQL并发控制(MVCC, 事务,事务隔离级别)
查看>>
DM***的第二阶段OSPF
查看>>
20180702搭建青岛RAC记录
查看>>
Spring Security OAuth 实现OAuth 2.0 授权
查看>>
linux文件及简单命令学习
查看>>
dubbo源码分析-架构
查看>>
新 Terraform 提供商: Oracle OCI, Brightbox, RightScale
查看>>