HTML:a标签的四种状态使用方法


在看网页源代码的时候遇到a:link和a:visited觉得很有意思,好奇地查了一下相关解释。

关于a标签

根据MDN DOCs记录,<a>元素也成为锚元素,可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。常用href属性来指示链接的目标地址;target属性用来规定在什么位置打开链接文档,其中默认属性_self表示在当前页面加载,_blank表示在新窗口打开。、

根据w3cschool记录,在所有浏览器中,链接的默认外观是:

  • 未被访问的链接带有下划线而且是蓝色的
  • 已被访问的链接带有下划线而且是紫色的
  • 活动链接带有下划线而且是红色的

a链接标签的四种状态

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

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

提示:在 CSS 定义中,a:hover 必须被置于 a:link 和 a:visited 之后,才是有效的。

提示:在 CSS 定义中,a:active 必须被置于 a:hover 之后,才是有效的。

提示:伪类名称对大小写不敏感。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



猜您在找 HTML选择器的四种使用方法 html常用标签的使用方法 HTML中的meta标签及其使用方法 HTML中base标签的使用方法 HTML标签中的Link标签的使用方法和场景 vuex的state中的数据的四种使用方法 HTML中javascript的