属性选择器
对带有指定属性的 HTML 元素设置样式。
ps：这个属性你可以自定义，随便啦，想写什么写什么。
eg:
vue中的scoped作用域属性就是用它来实现的。
在template模板中给style标签加上scoped属性就可以实现不同template页面其样式互不干扰
当然，属性选择器远远不止这些：
我们可以给相同的属性不同的值定义不同的样式
还可以向正则表达式那样，给属性值开头不同，结尾不同，中间含义不同分别设置不同的样式！
input[attr^=a] ------ 属性值【开头】为【“a”】的元素
input[attr$=a] ------ 属性值【结尾】为【“a”】的元素
input[attr*=a] ------ 属性值中含有【“a”】的元素
ps: 我属性前面的input是标签选择器的意思，你也可以用类名，id, 标签什么的都可以!
就像这样：
还有就是我上面css中写属性选择器中，我把属性的中用引号包裹了，事实上，你带不带引号都对！看个人习惯!
伪类选择器
选择第一个子元素：
父元素>子元素:first-child{}
ps：如果有很多父元素，要选择指定的用选择器就行 指定父元素>一堆子元素：first-child
选择最后一个子元素：
父元素>子元素:last-child{}
用法相同。
匹配属于父元素中唯一子元素的元素。
要匹配的子元素:only-child {}
当你使用这个选择器的时候，它会找一个自己是不是独生子女（父元素没有出了自已以外的其它子元素了），如果是独生子女，那就匹配成功，不是，不好意思，匹配失败！
匹配属于其父元素的特定类型的唯一子元素的每个元素。
要指定的子元素类型类型:only-of-type{}
这个真的不是很好理解，和only-child不同（only-child选择器选择的是父元素中只有一个子元素，而且只有唯一的一个子元素。也就是说，匹配的元素的父元素中仅有一个子元素，而且是一个唯一的子元素。），在伪类选择器前面是要指定的子元素类型, 然后当它匹配时候，会找自己在父元素里面是不是独一份（假设我们把标签比作男女的话，它的父亲有很多个孩子，但是其它的都是男孩，只有它是女孩），如果是，匹配成功，否则匹配失败
eg:
ps：大家看了这个选择器，现在可以把它忘掉了，因为讲道理来说，既然它是父元素里的唯一此标签子元素，我们完全可以通过: 父元素>此子元素标签 直接就把它定位了！完全不需要这么麻烦！
nth-child(n)系列伪类选择器
子元素列表 :nth-child(要选择的第几个)
需要注意一点就是，他不是从0开始选择，比如你要选择第一个子元素，那么
子元素列表 :nth-child(1)即可
子元素列表:nth-last-child((要选择的倒数第几个)
同 :nth-child类似，它也是从1开始的，nth-last-child(1)代表倒数第一个，也就是最后一个！
eg:
子元素列表：nth-child(odd) 匹配下标是奇数的子元素 子元素列表：nth-child(even) 匹配下标是偶数的子元素
嗯，可以用它来实现经典的隔行变色是在恰当不过的了！
除此之外，:nth-child里面还可以写一些计算。
:nth-child(数字n) 表示匹配该数字的倍数的意思，比如nth-child(3n)就表示匹配该元素下的所有3的倍数：
eg:
:nth-child(数字n) ,这个数字还可以进行简单的计算，比如，如果我写 :nth-child(3n-1)，则会匹配到下标分别为 2,5,8的子元素，因为3的一倍为3,3减1得到下标2的子元素, 3的2倍为6, 6减1得到下标5的子元素。
子元素集合:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.
好吧，官方描述可能坑，我们用例子来理解：
不同于 :nth-child(n) (选取父元素的第 N 个子元素，不论元素的类型。n 可以是数字（从 1 开始），关键词（even/odd）,或者公式（3n + 1, 2n + 1...）)
:nth-of-type(n)与 :nth-child(n) 的区别就在于 :nth-child(n) 不论元素的类型，而nth-of-type(2)选取父元素的第 N 个类型为 你所知道 的子元素。
上图中，父元素有2个span标签，第一个span标签在父元素的子元素集合中下标为2的位置，第二个span在父元素的子元素集合中下标为3的位置
我们使用 span:nth-child(2) 会选中第一个sapn标签，因为下标为1的子元素是p标签，
但是使用 span:nth-of-type(2) 则会选中第二个span标签，因为在该父元素的子元素集合中，第二个span标签是依据该父元素的子元素集合中的span标签集合中的第二个！！！！！！！
子元素集合:nth-last-of-type(n) n 可以是数字、关键词或公式。
这个用法同 :nth-of-type(n) 保持一致，只不过它是从倒数开始。
比如 span:nth-last-of-type(2)意思就是说选择父元素的倒数第二个span标签。
eg:
表单系列伪类选择器
:focus {}
表示该表单光标获得焦点时触发。
:
:enabled{} 选择启用状态的元素
凡是没有设置属性为disabled的表单都会匹配到，disabled为禁用该表单的意思
与:enabled{} 相对的，:disabled{}为选择 选择禁用状态的元素 例如：<input type="text" disabled />
:valid {} 验证输入合法时触发
与:valid {} 相对于，:invalid{}选择器在匹配不合法时触发,这里就不写例子了
伪对象选择器
:before
在【当前元素】之前插入【额外内容】 ，需要配合【content】一起
使用。【content】的值就是插入的内容，这个和:after是很常用的，因为可以把一个标签当三个标签来用，大网站经常用它来提示性能。
同:before{}对应，:after{}会在元素之后插入内容，同样，也需要配合content来使用
::selection 指鼠标选中“网页文本”状态的设定。
默认，我们的浏览器选中网页文本效果都是蓝色背景，白色文字：
我们可以通过::selection来更改默认样式:
ps: 记着是两个冒号！！！！！ ::selection
好了，差不多就是这些，要是后面还有比较重要的我在补充！