伪元素： 用来创造文档中不存在的元素。（css3规范推荐用两个冒号表示，但大多数浏览器也支持用一个冒号表示为元素） 常用伪元素如下：
- ::after ( :after) — 在选中元素的后面创造子元素 （默认行内元素）。
- ::before ( :before) — 在选中元素中的前面创造子元素（默认行内元素）。
- ::selection ( :selection) — 应用于文档中被用户高亮的部分（比如使用鼠标或其他选择设备选中的部分），只有部分属性允许使用该伪元素。
- ::first-letter ( :first-letter) — ::first-letter会选中某块级元素第一行的第一个字母，并且文字所处的行之前没有其他内容（如图片和内联的表格）
- ::first-line (:first-line) — 在某块级元素的第一行应用样式。
- ::slotted() — 用于选定那些被放在 HTML模板 中的元素
- ::cue ( :cue) — 匹配所选元素中的WebVTT提示。这可以用于在VTT轨道的媒体中使用字幕和其他线索。
伪 类： 用来表示元素的某种特殊状态。（用一个冒号表示）
常用伪类如下：
- :nth-child( n ) — 表示当前元素中所有兄弟元素的第 n 个子元素。例如 :nth-child(2n)的意思是匹配位置为 2、4、6、8…的元素。
- :first-child — 表示在一组兄弟元素中的第一个元素。
- :focus — 表示获得焦点的元素（如表单输入）。
- :hover — 一般用于表示当鼠标移过标签上的状态。
- :last-child — 表示在父元素中的最后一个子元素。
- :checked — 表示任何处于选中状态的radio、 checkbox 、selection。
- :active — 匹配被用户激活的元素。
- :default — 表示一组相关元素中的默认表单元素。
- :defined — 表示任何已定义的元素
- :disabled — 表示任何被禁用的元素。
- :enabled — 表示任何被启用的元素。
- :link — 用来选中元素当中的链接。
- :nth-last-child() — 从兄弟节点中从后往前匹配处于某些位置的元素
- :visited — 表示用户已访问过的链接。