css常用的伪类有哪些

在CSS中,伪类用于选择处于特定状态的HTML元素。以下是一些常用的CSS伪类:

:link:选择所有未被点击过的链接。

css 复制代码
a:link {  
  color: blue;  
}

:visited:选择所有已被点击过的链接。

css 复制代码
a:visited {  
  color: purple;  
}

:hover:选择鼠标指针浮动在上面的元素。

css 复制代码
a:hover {  
  color: red;  
}

:active:选择鼠标按下且未释放的元素。

css 复制代码
a:active {  
  color: yellow;  
}

这四种伪类经常一起使用来定义链接的样式,被称为"链接四态"(love/hate,分别对应:link:visited:hover:active)。

:focus:选择获得焦点的元素(如输入框)。

css 复制代码
input:focus {  
  border: 1px solid red;  
}

:first-child:选择其父元素的第一个子元素。

css 复制代码
p:first-child {  
  color: blue;  
}

:last-child:选择其父元素的最后一个子元素。

css 复制代码
p:last-child {  
  color: green;  
}
相关推荐
羊锦磊15 分钟前
[ vue 前端框架 ] 基本用法和vue.cli脚手架搭建
前端·vue.js·前端框架
brzhang23 分钟前
高通把Arduino买了,你的“小破板”要变“AI核弹”了?
前端·后端·架构
她说..27 分钟前
通过git拉取前端项目
java·前端·git·vscode·拉取代码
智能化咨询37 分钟前
玩转ClaudeCode:通过Chrome DevTools MCP实现高级调试与反反爬策略
前端·chrome·chrome devtools
Roadinforest1 小时前
水墨风鼠标效果实现
前端·javascript·vue.js
银嘟嘟左卫门2 小时前
上手 Rokid JSAR:新手也能快速入门的 AR 开发之旅
前端
右子2 小时前
HTML Canvas API 技术简述与关系性指南
前端·javascript·canvas
Lotzinfly2 小时前
10个JavaScript浏览器API奇淫技巧你需要掌握😏😏😏
前端·javascript·面试
合肥烂南瓜2 小时前
浏览器的事件循环EventLoop
前端·面试
golang学习记2 小时前
从0死磕全栈之Next.js after 函数详解:在响应完成后执行异步任务
前端