参考文档：https://developer.mozilla.org/zh-CN/docs/Web/CSS
（ 火狐自己维护的文档 ）
CSS概述
1. css指层叠样式表
2. 样式表由规则组成
3. 规则由选择器和声明块组成
4. 声明块由声明组成
5. 声明由CSS属性+css属性值组成的键值对
（ 浏览器读取选择器的顺序是由右向左 ）
基本选择器及其扩展
1.基本选择器
通配符选择器
id选择器 #
类选择器 .
元素选择器 元素名
后代选择器 空格
分组选择器 , (结合符）
2. 扩展
（ 使用前要查看属性是否可以继承，是否有初始值 ）
子元素选择器也可称为直接后代选择器 #wrap>.inner
相邻兄弟选择器 #first + .inner
( 紧跟着！ ）
通用兄弟选择器 #first ~ .inner
选择器分组 h1,h2,h3
属性选择器
1. 存在和值属性选择器
[attr] : 该选择器包含attr属性的所有元素，不论attr的值为何
[attr=val]: 该选择器仅选择attr属性被赋值为val的所有元素
[attr~=val]:表示带有以attr命名的属性元素，并且该元素是一个以空格作为分隔的值列表，其中至少一个值为val
2. 子串值属性选择器
[attr|=val]：选择attr属性的值是val或val-开头的元素
[attr^=val]：选择attr属性的值以val开头（包含val）的元素
[attr$=val]：选择attr属性的值以val结尾（包含val）的元素
[attr*=val]：选择attr属性的值中包含字符串val的元素
伪类与伪元素选择器
伪类与伪元素的存在为了让css有能力选中dom以外的东西
1. 链接伪类
注意：:link， :visited，:target是作用于链接元素的 <a/>
:link 未访问链接，并指向一个未访问的地址的所有锚
:visited 已访问链接，并指向一个未访问的地址的所有锚
（只有color background-color border-color才能应用到已访问链接）
:target 代表一个特殊元素，他的id是url的片段标识符
2. 动态伪类
注意：:hover :active基本可以作用于所有元素
:hover 表示悬浮在元素上
:active 点击按住时
优先级：
若没有a{}
若无a:link，a:link将采用默认的字体大小和颜色
若无a:hover，a:hover将继承a:link的所有属性。若有a:link，a:hover继承自己没有的属性。
若没有a:active，a:active将先继承a:hover中的所有属性，然后从a:link继承没有的属性。
若没有a:visited, a:visited将采用默认的字体大小和颜色。
总结：优先级L->V->H->A。可以这样记LoVe HAte（爱恨）
3. 表单伪类
:enabled 匹配可编辑表单
:disable 匹配被禁用表单
:checked 匹配被选中的表单
:focus 匹配获焦的表单
4.结构性伪类
注意：index的值是从1开始的
index可以为变量n(只能是n)
index可以为even odd
:nth-of-type以元素为中心（这是一个坑）
:empty指内容必须为空，有空格都不行
:nth-child(index)系列
:first-child
:last-child
:nth-last-child(index)
:only-child
例：#warp li:nth-child(1)
找到#warp底下的所有子元素，并且选中第一个子元素，并且这个子元素必须是li
:nth-of-type(index)系列
:first-of-type
:last-of-type
:nth-last-type(index)
:only-of-type
例：#warp li:nth-of-type(1)
找到#warp底下第一个li
:not
例：div>a:not(:last-of-type)
:empty
5.伪元素选择器
::after
::before
::first-line
::first-letter
