CSS 伪类 (Pseudo-classes)

锚伪类:在支持 CSS 的浏览器中,链接的不同状态都可以不同的方式显示,这些状态包括:活动状态,已被访问状态,未被访问状态,和鼠标悬停状态。

a:link {color: #FF0000}		/* 未访问的链接 */
a:visited {color: #00FF00} /* 已访问的链接 */
a:hover {color: #FF00FF} /* 鼠标移动到链接上 */
a:active {color: #0000FF} /* 选定的链接 */

对于a标签的使用经常通过伪类来改变样式,比如hover悬停后的background背景,font-size字体大小,text-decoration文本样式(none去下划线),color字体颜色等,但是在:visited下却无法改变这么多样式。

 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.fi:hover{
text-decoration: none;
color: green;
font-size: 20px;
background-color: red;
border: 1px solid black;
}
.se:visited{
text-decoration: none;/*无效*/
color: green;
font-size: 20px;/*无效*/
background-color: red; /*这个按理来说应该有效*/
border: 1px solid black;/*无效*/
}
</style>
</head>
<body>
<a href="#qwe" class="fi">123465</a><br />
<a href="#aasd" class="se">7890</a>
</body>
</html> 

原因在于:visited的privacy concerns隐私保护。原文链接

许多年前,CSS:visited曾是一种查询用户历史记录的途径,它自身并没有什么威胁,但是当其与js中的getComputedStyle()联合,便可以通过你的历史记录找到你去过哪里。其速度可达到210,000 URLs每分钟,那么就有可能获得你大量的历史信息或者通过指纹打印复制你的身份。由于浏览器可以保存很长一段时间的历史记录,这种方法可以暴露你相当一部分浏览信息。

CSS中:visited的隐私保护的更多相关文章

  1. 在CSS中定义a:link、a:visited、a:hover、a:active顺序

    摘自:http://blog.snsgou.com/post-2.html     以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料,发现 ...

  2. 【经验】在CSS中定义超链接样式a:link、a:visited、a:hover、a:active的顺序

    以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料,发现很多人问到这个问题,给出的结果我试了试,大部分都不正确. 给出我试的顺序,可能会对大 ...

  3. 【经验】在CSS中定义a:link、a:visited、a:hover、a:active顺序

    摘自:http://www.qianyunlai.com/post-2.html     以前用CSS一直没有遇到过这个问题,在最近给一个本科同学做的项目里面.出现一些问题,搜索引擎查了一些网站和资料 ...

  4. CSS中定义a:link、a:visited、a:hover、a:active顺序

    a :link.a:hover.a:visited这几个元素,定义CSS时候的顺序不同,也会直接导致链接显示的效果不同. eg:让未访问链接颜色为red,活动链接为yellow,已访问链接为green ...

  5. CSS中一些常见的兼容性问题

    CSS中一些兼容性问题就是浏览器兼容,而这些浏览器兼容问题主要是Ie和FF之间的争斗. CSS hack中的一些事: 我们为了让页面形成统一的效果,要针对不同的浏览器或不同版本写出对应可解析的CSS样 ...

  6. HTML和CSS设置动态导航以及CSS中伪元素的简单说明

    HTML页面代码: <!DOCTYPE html> <html> <head> <title>Test</title> <meta c ...

  7. 理解是最好的记忆方法 之 CSS中a链接的④个伪类为何有顺序

    理解是最好的记忆方法 之 CSS中a链接的④个伪类为何有顺序 在CSS中,a标签有4种伪类,分别为: a:link, a:visited, a:hover, a:active 对其稍有了解的前端er都 ...

  8. CSS中a标签样式的“爱恨”原则

    CSS为一些特殊效果准备了特定的工具,我们称之为“伪类”.其中有几项是我们经常用到的,下面我们就详细介绍一下经常用于定义链接样式的四个伪类,它们分别是: 1 :link 2 :visited 3 :h ...

  9. 关于css中伪类及伪元素的总结

    css中的伪类和伪元素总是混淆,今天参考了很多资料,也查看了部分文档,现将伪类及伪元素总结如下: 一.由来: 伪类和伪元素的引入都是因为在文档树里有些信息无法被充分描述,比如CSS没有"段落 ...

随机推荐

  1. ubuntu apache2 ssl配置

    Ubuntu下HTTPS配置非常简单,对大部分用户而言,使用普通的自签名证书,只需按照步骤进行就可以了,无需了解密钥.证书的更多知识,更深的背景 知识还有RSA算法.DES算法.X509规范.CA机构 ...

  2. leetcode--011 copy list with random pointer

    aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAA3UAAABjCAIAAACzC75sAAAMTElEQVR4nO3cyYHivBYG0D8n0nIojo ...

  3. Memcached源码分析之thread.c

    /* * 文件开头先啰嗦几句: * * thread.c文件代表的是线程模块.但是你会看到这个模块里面有很多其它方法, 例如关于item的各种操作函数,item_alloc,item_remove,i ...

  4. Tomcat用法--Servlet开发

    本来想玩一下微信公众号开发,没想到学习曲线真是恶心的很,首先你要配置Tomcat--你要会Servlet--你要会JSP,妈的!贴出来 快哭瞎了,各种文档,好吧,提供一个教你搞java EE文档的博客 ...

  5. SQL数据库置疑修复

    SQL数据库置疑修复 首先分析数据库置疑的原因,查明原因分析数据库置疑修复的方法,解决置疑后,考虑数据库置疑的预防方案.   数据库置疑产生的原因: 1.sql所在分区空间是否够?数据库文件大小是否达 ...

  6. 基于Python,scrapy,redis的分布式爬虫实现框架

    原文  http://www.xgezhang.com/python_scrapy_redis_crawler.html 爬虫技术,无论是在学术领域,还是在工程领域,都扮演者非常重要的角色.相比于其他 ...

  7. 那就用pthon来写个跳板机吧

    1.需求 程序一: 1.后台管理 - 堡垒机上创建用户和密码(堡垒机root封装的类,UserProfile表) - .bashrc /usr/bin/python3 /data/bastion.py ...

  8. 1.4.2.3. SETUP(Core Data 应用程序实践指南)

    初始化Core Data的三个方法: init,初始化托管对象模型.持久化存储协调器.托管对象上下文 - (id)init { ) { NSLog(@"Running %@ '%@'&quo ...

  9. Unity 5 Stats窗口

    Unity5的 Statistics上的统计信息和Unity4 有一些区别, Statistics窗口,全称叫做 Rendering Statistics Window,即渲染统计窗口(或渲染数据统计 ...

  10. C# 常用工具合集

    Visual Studio 2013 扩展 Visual Studio 2013 Update 4:是目前微软发布的最新版开发工具升级包,高效而且强大.下面的扩展都是该版本的Visual Studio ...