GIS君-Manchan's blog GIS君-Manchan's blog
首页
  • 前端文章

    • HTML5
    • CSS3
    • JavaScript
  • 学习笔记

    • CSS选择器世界
地信
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 旧版博客
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

まん酱/GIS君

一个正在学习中的GISer~
首页
  • 前端文章

    • HTML5
    • CSS3
    • JavaScript
  • 学习笔记

    • CSS选择器世界
地信
  • 技术文档
  • GitHub技巧
  • Nodejs
  • 博客搭建
  • 旧版博客
  • 学习
  • 面试
  • 心情杂货
  • 实用技巧
  • 友情链接
关于
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 《CSS选择器世界》

    • 概述
    • CSS选择器的优先级
    • CSS选择器的命名
    • 精通CSS选择符
    • 元素选择器
    • 属性选择器
    • 用户行为伪类
    • URL定位伪类
      • 链接历史伪类:link和:visited
      • 超链接伪类:any-link
      • 目标伪类:target
    • 输入伪类
    • 树结构伪类
  • 学习笔记
  • 《CSS选择器世界》
GIS君-manchan
2022-11-28
目录

URL定位伪类

本章主要介绍与浏览器地址栏中地址相关的一些伪类。

# 链接历史伪类:link和:visited

:link 伪类用来匹配页面上 href 链接没有访问过的<a>元素。现在并不常用。

:visited 伪类用来匹配页面上访问过的链接。出于隐私原因,可以使用此选择器修改的样式非常有限。

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

  • color
  • background-color
  • border-color (和它的子属性)
  • outline-color
  • fill 和 stroke 属性的颜色部分

此外,即便是上述样式,你也不能给访问过和未访问过设置不同的透明度。你不能使用rgba()、hsla()或是 transparent 关键词。

# 超链接伪类:any-link

:link 伪类有两大缺点:

  • 只能设置未访问过的元素的样式,对已经访问过的元素完全无效,已经访问过的元素还需要额外的 CSS 设置
  • 只能作用于<a>元素,和标签选择器 a 看起来没差别,完全竞争不过更简单有效的标签选择器 a,因而沦为鸡肋伪类正是因为:link 伪类存在这些不足,所以 W3C 官方才推出了新的:any-link 伪类,:any-link伪类的实用性就完全发生了变化。

正是因为:link 伪类存在这些不足,所以 W3C 官方才推出了新的:any-link 伪类

:any-link 伪类有如下两大特性。

  • 匹配所有设置了 href 属性的链接元素,包括<a>、<link>和<area>这3 种元素匹配所有匹配
  • link 伪类或者:visited 伪类的元素。

# 目标伪类:target

:target CSS 伪类 代表一个唯一的页面元素 (目标元素),其id与当前URL的hash匹配。

微信 支付宝
#CSS#CSS选择器
文章更新于: 2022/12/01 16:05:30
用户行为伪类
输入伪类

← 用户行为伪类 输入伪类→

最近更新
01
前端面试学习
01-02
02
Markdown首行缩进
12-01
03
缅怀 | 加强测绘工作 发展地理信息产业
12-01
更多文章>
Theme by Vdoing | Copyright © 2020-2023 Manchan All rights reserved.
鄂ICP备2020015911-1号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式