选择器及常用伪类、伪元素选择器

基础选择器
元素选择器（标签名）、类选择器（*）、ID选择器（#）

结构选择器
子代选择器 、 后代选择器
兄弟选择器 兄弟元素A+兄弟元素B(AB之间不能有其它元素)
通用选择器 兄弟元素A~兄弟元素B（A之后的所有兄弟元素B）

属性选择器
元素[属性名=“属性值”]
[属性名=“属性值”]选中全部有此属性的元素
选中以xxx开始 元素[属性名^=“xxx”]
选中以xxx结束 元素[属性名$=“xxx”]
指定属性中包含xxx 元素[属性名=“xxx”]
另一种简写的属性选择器div.box 选择div中class为box的元素

结构伪类选择器
:nth-child(n) ： n可写数值或函数 odd奇数（2n） even偶数（2n+1）
如果想选择第三个开始以后的元素：:nth-child(n+3)（取值从0开始）
如果想选择第三个开始以前的元素：:nth-child(-n+3)
选中第4个到第7个元素： :nth-child(n+4):nth-child(-n+7)

:nth-of-type(n): n可写数值或函数

：first-child（）、nth-child(1)、nth-of-type(1):第一个元素、last-child、last-of-type最后一个元素、nth-last-child(1)、nth-last-of-type(1)、从后往前数第一个（相当于最后一个）

否定选择器
:not(:nth-child(n))
对多个兄弟进行否定:not(:nth-child(n)):not(:nth-child(n))
只有一个元素：only 没有元素：empty

动态伪类元素
:link 未访问
:visited 以访问
:focus 焦点、激活（input\a 键盘tab ） 可选中单选/多选/下拉/文本框/a标签
:hover 悬停
:active 点击时
:target 锚点选中后
:valid 当前标签是否合法（符合规则）例：设置input为必填选项 input:valid当input里有内容则发生事件

伪元素 默认是行盒
:：first-line 第一行
:：first-letter 第一个字
::before 当前标签之前添加东西
::after 当前标签之后添加东西

（当前标签与::after 和 ::before 层次关系
父子级关系
当前标签是父元素
::after、::before 是子元素
::before 是当前标签的第1个子元素
::after是当前标签的最后1个子元素）
::selection 选中区域的样式添加（选中后的文字效果）（只能改变字体和背景颜色）