什么是伪类：
伪类用于定义元素的特殊状态。
例如，它可用于：
- 当用户将鼠标悬停在元素上时为其设置样式
- 样式访问和未访问的链接不同
- 在获得焦点时设置元素的样式
伪类的用法：伪类：{
}
伪类的种类：
/*链接伪类*/ 注意:link，:visited，:target是作用于链接元素的！
:link 表示作为超链接，并指向一个未访问的地址的所有锚
:visited 表示作为超链接，并指向一个已访问的地址的所有锚
:target 代表一个特殊的元素，它的id是URI的片段标识符
/*动态伪类*/ 注意:hover，:active基本可以作用于所有的元素！
:hover 表示悬浮到元素上
:active 表示匹配被用户激活的元素（点击按住时）
/* 隐私与:visited选择器*/
只有下列的属性才能被应用到已访问链接：
color
background-color
border-color
由于a标签的:link和:visited可以覆盖了所有a标签的状态，所以当:link，:visited，:hover，:active同时出现在a标签
身上时 :link和:visited不能放在最后！！！
所以一般顺序为：LVHA
/*表单相关伪类*/
:enabled 匹配可编辑的表单
:disable 匹配被禁用的表单
:checked 匹配被选中的表单
:focus 匹配获焦的表单
/*结构性伪类*/
i下面的ndex的值从1开始计数！！！！
index可以为变量n(只能是n)
index可以为even odd
#wrap ele:nth-child(index) 表示匹配#wrap中第index的子元素 这个子元素必须是ele
#wrap ele:nth-of-type(index) 表示匹配#wrap中第index的ele子元素
:nth-child(index)系列
:first-child
比如： P:first-child 选中的是，每个标签的第一个儿子是p的标签！
:last-child
比如： P:first-child 选中的是，每个标签的最后一个儿子是p的标签！
:nth-last-child(index)
:only-child
(相对于:first-child:last-child 或者 :nth-child(1):nth-last-child(1))
:nth-of-type(index)系列
:first-of-type
:last-of-type
:nth-last-type(index)
:only-of-type
(相对于:first-of-type:last-of-type 或者 :nth-of-type(1):nth-last-of-type(1))
除此之外:nth-child和:nth-of-type有一个很重要的区别！！
个人总结：nth-of-type以儿子元素为中心，nth-child是以父亲元素为中心！！！
解释：如果父亲元素参杂其他元素，nth-child会将其他元素也算进去，但是nth-of-type不会
例子：
结论：都是2，但是结果却不同
:not
:empty(内容必须是空的，有空格都不行，有attr没关系)
/*伪元素*/
::after 在元素最后添加内容 内容添加：content：“要添加的内容”
::before 在元素最前添加内容 内容添加：content：“要添加的内容”
::firstLetter 选择文本的第一个单词
::firstLine 选择文本的第一行
::selection 就是选择文本时（就是要复制时触发）
以上是自己以前学习的心得，然后又更新和解释
原文地址：https://www.cnblogs.com/zhangjiayimy/p/9876440.html