CSS背景颜色
通过CSS背景属性，可以给页面元素添加背景样式
背景属性可以设置背景颜色，背景图片，背景平铺，背景图片位置，背景图像固定等。
1，背景颜色
background-color属性定义了元素的背景颜色
语法：
background-color：颜色值;
一般情况下元素背景颜色默认值是transparent（透明），我们也可以手动指定背景颜色为透明色。
2，背景图片
background-image 属性描述了元素的背景图像，实际开发常见于LOGO或者一些装饰性的小图片或者是超大的背景图片，优点是非常便于控制位置（精灵图也是一种运用场景）
语法：
background-image ：none /url（地址路径）
none：无背景图（默认的）
url：使用绝对或相对地址指定背景图像
3，背景平铺
如果需要在HTML页面上对背景图像进行平铺，可以使用background-repeat属性
语法：
background-repeat：repeat / no-repeat / repeat-x / repeat-y
repeat：背景图像在纵向和横向上平铺（默认的）
no-repeat：背景图像不平铺
repeat-x：背景图像在横向上平铺
repeat-y：背景图像在纵向平铺
4，背景图片位置
利用background-position属性可以改变图片在背景中的位置。
语法：
background-position：x y；
参数代表的意思是：x坐标 和 y坐标，可以使用方位名称或者精确单位
length：百分数 /由浮点数和单位标识符组成的长度值
position：top/center/bottom/ left/ cetner / right方位名词
4.1参数方位名词
1，如果指定两个值都是方位名词，则两个值前后顺序无关，比如left top和 top left 效果一致
2，如果只指定了一个方位名词，另一个值省略，则第二个值默认居中对齐。
4.2，参数是精确单位
1，如果参数值是精确坐标，那么第一个肯定是x坐标，第二个一定是y坐标。
2，如果只指定一个数值，那该数值一定是x坐标，另一个默认垂直居中。
4.3 参数是混合单位
1，如果指定的两个值是精确单位和方向名词混合使用，则第一个值是x坐标，第二个值是y坐标。
5，背景图像固定（背景附着）
background-attachement属性设置背景图像是否固定或者随着页面的其余部分滚动
语法：
background-attachment : scroll / fixed
scroll : 背景图像是随对象内容滚动
fixed：背景图像固定
6，背景复合写法
为了简化背景属性的代码，我们可以将这些属性合拼简写在同一个属性background中，从而节约代码量。
当使用简写属性时，没有特定的书写顺序，一般习惯约定顺序为：
background：背景颜色 背景图片地址 背景平铺 背景图像滚动 背景图片位置。
语法：
background：red url（img.jpg） no-repeat fixed cenet top;
7,背景色半透明
CSS3为我们提供了背景颜色半透明的效果
语法：
background: rgba(0,0,0,0.3);
1，最后一个参数是alpha透明度，取值范围在0~1之间
2，我们习惯把0.3的0省略掉，写为background：rgba（0,0,0,.3）;
注意：背景半透明是指盒子背景半透明，盒子里面的内容不受影响。
8，背景总结
1，background-color ，作用：背景颜色，值：预定义的颜色值/十六进制/RGB代码
2，background-image，作用：背景图片，值：url（图片路径）
3，background-repeat，作用：是否平铺，值：repeat/no-repeat/repeat-x/repeat-y
4，background-position，作用：背景位置，值：length/position 分别是x 和 y坐标
5，background-attachment，作用：背景附着，值：scroll（背景滚动）/fixed（背景固定）
6，背景简写，作用：书法更简单，值：背景颜色 背景图片地址 背景平铺 背景滚动 背景位置；
7，背景色半透明，作用：背景颜色半透明，值：background：rgba（0,0,0,0.3）；后面必须是4个值
8，背景图片：实际开发常见于logo或者一些装饰性的小图片或者是超大的背景图片，优点是非常便于控制位置，（精灵图也是一种运用场景）。
CSS的三大特性
CSS有三个非常重要的三个特性：层叠性，继承性，优先级
1，层叠性
相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一个冲突的样式，层叠性主要解决样式冲突的问题
层叠性原则：
1，样式冲突，遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式
2，样式不冲突，不会层叠。
2，继承性
CSS中的继承：子标签会继承父标签的某些样式，如文本颜色和字号，简单的理解就是：子承父业。
1，恰当地使用继承可以简化代码，降低CSS样式的复杂性
2，子元素可以继承父元素的样式（text- ，font-，line-这些元素开头的可以继承，以及color属性）
2.1，行高的继承性
语法：
body {
font: 12px/1.5 "microsoft yahei";
}
1，行高可以跟单位也可以不跟单位
2，如果子元素没有设置行高，则会继承父元素的行高为1.5
3，此时子元素的行高是：当前子元素的文字大小*1.5倍
注意：body行高1.5 这样写法最大的优势就是里面子元素可以根据自己文字大小自动调整行高
3，优先级
选择器劝重：
继承 或者* ：0,0,0,0
元素选择器：0,0,0,1
类选择器 ，伪类选择器：0,0,1,0
ID选择器：0,1,0,0
行内样式 style="" :1,0,0,0
!important 重要的
优先级注意点：
1，权重是有4组数字组成，但是不会有进位。
2，可以理解为类选择器永远大于元素选择器，id选择器永远大于类选择器，以此类推。
3，等级判断从左到右，如果某一位数值相同，则判断下一位数值，。
4，可以简单记忆法：通配符合继承权重为0，标签选择器为1, 类（伪类）选择器为10，id选择器100，行内样式表为。1000，！important无穷大。
5，继承的权重是0，如果该元素没有直接选中，不管父元素权重多高，子元素得到的权重都是0。
权重叠加优先级
权重叠加：如果是复合选择器，则会有权重叠加，需要计算求权重
div ul li --------> 0,0,0,3
.nav ul li --------> 0,0,1,2
a:hover --------> 0,0,1,1
.nav a -------->0,0,1,1
