MDN wants to learn about developers like you: https://qsurvey.mozilla.com/s3/MDN-dev-survey

隐私与:visited选择器

这篇翻译不完整。请帮忙从英语翻译这篇文章

曾经,CSS选择器 :visited 被网站用来查看用户的浏览记录。通过使用 getComputedStyle() 或其他方法扫描用户的浏览记录来获取用户访问了哪些网站。这很容易实现,不仅能够判断用户是否曾经访问过这个页面,还能猜测出大量的用户身份信息。

为了解决这个问题,Gecko 2 作出了修改来限制获取有关已访问链接的信息。

善意的谎言

第一个改变是Gecko会在某些情况下对网页程序撒谎,尤其是 getComputedStyle() 和类似的功能,比如 element.querySelector() 总是返回值表示用户从未访问过网页上的任何一个链接。 

另外,如果用到了兄弟选择器,如 :visited + span<span> 显示为未访问的样式。

而且,在极少的情况下,如果用到了嵌套链接元素并且这个匹配的元素与历史记录中的不同,这个链接也以未访问的样式绘制。

对已访问链接样式的限制

你仍然可以给已访问链接设置视觉样式,但是对可用样式作出了限制。只有下列的属性才能被应用到已访问链接:

此外,即使你可以为已访问链接设置属性,但是无法改变未访问和已访问链接的透明度,否则你能使用 rgba() 和 hsla() 颜色值或 transparent 关键词。

这是一个使用被限样式的例子:

:link {
   outline: 1px dotted blue;
   background-color: white;
   /* background-color 的默认值为 'transparent'。
      你必须指定一个不同值,否则无法应用对 :visited 的修改 */
}

:visited {
   outline-color: orange;     /* 已访问链接的轮廓为橘色 */
   color: yellow;             /* 已访问链接的文本为黄色 */
   background-color: green;   /* 已访问链接的背景为绿色 */
}

对WEB开发者的影响

总体来说,这不会显著地影响到WEB开发者。但在一些特殊情况下,网站需要做些修改:

  • 使用背景图片来区分链接是否被访问过的样式不再起作用,因为只有颜色才能被作用到已访问链接上。
  • CSS 过渡 不再支持已访问链接。幸运的是,CSS过渡是非常新的技术,目前很少有网站在使用它,所以这不太可能影响到很多人。

更多

文档标签和贡献者

标签: 
 此页面的贡献者: 599316527
 最后编辑者: 599316527,