1、伪类，与类类似，但实际上并没有类回复加到标记中的标签上。分两种：
a、UI伪类 会在HTML元素处于某个状态时（比如鼠标指针位于链接上），为该元素应用CSS样式
b、结构化伪类 会在标记中存在某种结构上的关系时（如某个元素是一组元素中的第一个或最后一个），为相应元素应用CSS样式
2、UI伪类
基于特定HTML元素的状态应用样式。最常使用的UI伪类的元素是链接（a元素），利用UI伪类，链接可以在用户鼠标悬停时改编文本颜色，或者去掉文本的下划线
2.1、链接伪类（LoVe HA 便于记忆）
a、Link 此时，链接就在那等着用户点击
b、Visited 用户此前点击过这个链接
c、Hover 鼠标指针正悬停在链接上
d、Active 链接正在被点击（鼠标在元素上按下，还么有释放）
a:link {color:black;}
a:visited {color:gray;}
a:hover {text-decoration:none;}
a:active {color:red;}
2.2、focus伪类
表单中的文本字段在用户单击它时会获得焦点，然后用户才能在其中输入字符
2.3、target伪类
用户点击一个指向页面中其他元素的链接，则那个元素就是目标（target），可以用:target伪类选中它
3、结构化伪类
根据标记的结构应用样式，比如根据某元素的父元素或者前面的同胞元素是什么
3.1、:first-child和:last-child
e:first-child 代表一组同胞元素中的第一个元素
e:last-child 代表最后一个元素
e表示任何元素
<ol class="results">
<li>my fast pony</li>
<li>steady trotter</li>
<li>slow ol' nag</li>
</ol>
ol.results li:first-child {color:blue;}应用上面序列中，my first pony会变成蓝色
4、伪元素
::first-letter 选中首个字符
::first-line 选中文本段落的第一行
::before 特定元素前面添加特殊的内容
::after 特定元素后面添加特殊的内容
<p class="age">25</p>
p.age::before {content:"Age: ";}
p.age::after {content:"years. ";}
结果显示如下：
Age 25 years.
Notice~ 搜索引擎不会取得伪元素的信息（因为它在标记中并不存在），因此，不要通过伪元素添加你想让搜索引擎索引的重要内容