伪元素和伪类的区别在于，伪元素是在文档中没有实际存在的元素，而伪类是对元素在特定状态下的描述。比如，常用的::before和::after就是伪元素，可以在元素前后插入虚拟的元素，用来实现一些特殊的样式效果；而:hover和:focus等就是伪类，用来实现当鼠标指针悬停或元素获取焦点时的样式效果。需要注意的是，伪元素前面需要两个冒号，而伪类只需要一个冒号。另外，伪元素的内容可以通过content属性来指定，而伪类不能改变元素本身的内容。同时，伪元素的样式可以通过CSS的全部属性来定义，而伪类只能使用一些特定的属性（如color、background等）。
总体来说，伪元素的应用范围更广一些，可以实现很多特殊的效果，而伪类则更多地用于交互效果的实现。
伪元素和伪类的区别在于它们所影响的元素不同。伪类是影响元素的某个状态，例如:hover、:active，而伪元素则是影响元素的某个部分，例如::before、::after。 伪类通常使用单冒号“:”表示，而伪元素则使用双冒号“::”表示。两者的语法和使用方式有所不同。 总的来说，伪类更多的是对元素状态的控制，而伪元素则是对元素内容的控制。在样式设计上，伪类和伪元素的组合可以实现更为复杂的效果和布局。
htma伪类样式的四种状态:
链接四种状态：顺序是固定的(如先link->visited->hover->active顺序不能乱)
link 默认，没有访问（没有点击）
active 激活，当鼠标点击压下去的时候
autofocus 第一个能应用到焦点 其它不行
focus ： 如果规定了，将在主流浏览器&ie8+中支持(否则ie不支持)
lang：如果规定了，将在主流浏览器&ie8+中支持(否则ie不支持)