百科狗-知识改变命运!

:visited - 链接已被访问过 - css 动态伪类选择器

乐乐2年前 (2023-11-21)阅读数 32#技术干货
文章标签样式

:visited

定义和用法

  • :visited,访问过的链接。
  • :visited,是一个伪类,并且它适用于到已经访问的另一资源的超链接。
  • :visited,适用于指向已访问的URL的链接,访问URL是链接点显示在用户代理的历史记录中的网址。
  • :visited,此状态与:link状态互斥。

语法:

:link

设置超链接在其链接地址已被访问过时的样式。

:visited - 链接已被访问过 - css 动态伪类选择器

  • 如果需要给超链接定义:访问前,鼠标悬停,当前被点击,已访问。这4种伪类效果,而又没有按照一致的书写顺序,不同的浏览器可能会有不同的表现
  • 超链接的4种状态,需要有特定的书写顺序才能生效。超链接状态顺序::link:visited:hover:active注意:hover必须位于:link:visited之后,:active必须位于:hover之后

限制

出于隐私原因,浏览器严格限制您可以让此伪类应用的样式,以及使用它们的方式:

  • 允许使用的 CSS 属性为color,background-color,border-color,border-bottom-color,border-left-color,border-right-color,border-top-color,column-rule-color,和outline-color
  • 允许使用的 SVG 属性为fillstroke
  • 允许使用的样式的αlpha 分量(透明度)将被忽略。设置在:visited中的样式将使用元素的非:visited访问状态的αlpha 分量,如果该分量为0,这个样式将被完全忽略。
  • 虽然这些样式可以改变用户最终的颜色外观,但window.getComputedStyle方法将存在并且始终返回非访问颜色的值。

浏览器支持

所有浏览器都支持

例子

/* 所有被访问过的  变绿 */

a:visited {color: green;}

未设置颜色或透明的属性不能使用:visited。在可以使用此伪类设置的属性中,浏览器可能只有colorcolumn-rule-color两个默认值。因此,对于其他属性,在使用:visited选择器前,应该先为这些属性设置基础样式。

//HTML
你是否访问过此链接?
你已经访问过此链接。


//CSS
 /* 指定某些属性的默认值,允许他们使用:visited状态进行样式设置 */ 

a { 

 background-color: white; 
  border: 1px solid white; 
}
 

a:visited { 
  background-color: yellow; 
  border-color: hotpink;
  color: hotpink;
}
 

内容声明:本文中引用的各种信息及资料(包括但不限于文字、数据、图表及超链接等)均来源于该信息及资料的相关主体(包括但不限于公司、媒体、协会等机构)的官方网站或公开发表的信息。部分内容参考包括:(百度百科,百度知道,头条百科,中国民法典,刑法,牛津词典,新华词典,汉语词典,国家院校,科普平台)等数据,内容仅供参考使用,不准确地方联系删除处理!本站为非盈利性质站点,本着为中国教育事业出一份力,发布内容不收取任何费用也不接任何广告!)
{if $zbp->Config('yd1125')->foot}