说到伪类选择器我一个就想到的是hover
hover---鼠标悬停在元素上方时,向元素添加样式或修改样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
a:hover
{
background-color:yellow;
}
</style>
</head>
<body>
<a href="">你好</a>
<a href="">你好</a>
</body>
</html>
可自行复制查看,鼠标移动到你好标签上时,背景颜色会进行改变。
伪类选择器就是在这个元素后加“:” 跟上伪类属性。
其他还有
:link 用法--a:link 选择所有未访问链接
:visited 用法--a:visited 选择所有访问过的链接
:active 用法--a:active 选择活动链接
:hover 用法--a:hover 选择鼠标在链接上面时
:focus 用法--input:focus 选择具有焦点的输入元素
:first-letter 用法--p:first-letter 选择每一个<p>元素的第一个字母
:first-line 用法--p:first-line 选择每一个<p>元素的第一行
:first-child 用法--p:first-child 指定只有当<p>元素是其父级的第一个子级的样式
:before 用法--p:before 在每个<p>元素之前插入内容
:after 用法--p:after 在每个<p>元素之后插入内容
:lang 用法--p:lang(it) 选择一个lang属性的起始值="it"的所有<p>元素