背景相关属性background
1, 背景颜色;
属性名：background-color（bgc）
颜色取值：关键字（red）、rgb表示法( 255,255,255 )、rgba表示法( 255,255,255,0.5 )、十六进制( #fff )……
注意点：
背景颜色不会影响盒子大小，并且还能看清盒子的大小和位置，一般在布局中会习惯先给盒子设置背景颜色
rgba代码 背景会变透明，文字不会透明
2, 背景图片;
属性名：background-image（bgi）属性值：
注意点：
背景图片中url中可以省略引号
背景图片默认是在水平和垂直方向平铺的
背景图片仅仅是指给盒子起到装饰效果，类似于背景颜色，是不能撑开盒子的
如果图片的大小没有标签的大小大，图片会自动在水平和垂直方向进行平铺和填充；
1.背景图片的平铺方式：
background repeat： 默认，水平和垂直都需要平铺；
background no-repeat： 水平和垂直都不需要平铺；
background repeat-x： 只在水平方向平铺；
background repeat-y： 只在垂直方向平铺；
同一个标签可以同时设置背景颜色和背景图片，如果同时存在时，
那么图片会覆盖背景颜色；
2.背景图片的位置：
格式：
background-position：水平方向 垂直方向;
取值：
1,若取值为方位名词，则移动的是自身的宽度 如取值left 表示向左移动自身的宽度
2,若取值为具体像素，则移动具体的像素单位 x轴上 向右为正，越往右越大； 向左为负
a具体方位名词:
水平方向：left center right （left默认）
垂直方向：top center bottom （top默认）
b具体像素：
background-position：100px 200px (一定要带单位) background-position：left top;
默认0px 0px ,具体的像素可以是负数-100px -200px， x越往右越大，y越往下越大；
3.背景图片大小：
Ø 作用：设置背景图片的大小， Ø 语法：background-size：宽度 高度； 取值： 数字+px 百分比 自身宽高的百分比 contain 将背景图片等比例缩放，直到不会超出盒子的最大，会留白 cover 覆盖，将图片等比例缩放 直到刚好填满整个盒子没有空白；
3，连写
属性值：
单个属性值的合写，取值之间以空格隔开
书写顺序：
颜色 背景图 重复 位置 大小
推荐：background：color image repeat position / size //顺序不限,一般按照推荐写法
background: yellow url("../美女高清壁纸【第二期】\ (31).jpg" no-repeat left top);
css三大特性
1，层叠性
相同选择器给设置相同的样式，此时后面的一个样式就会覆盖（层叠） 另前面一个冲突的样式。
层叠性主要解决样式冲突的问题， 遵循的原则是就近原则，哪个样式离结构近，就执行哪个样式
2，继承性
子标签会继承父标签的某些样式，如文本颜色和字号
（text-，font-，line-这些元素开头的可以继承，以及color属性）
3，优先级
当同一个元素指定多个选择器，就会有优先级的产生。
选择器相同，则执行层叠性
选择器不同，则根据选择器权重执行
不同选择器具有不同的优先级,优先级高的选择器样式会覆盖优先级低选择器样式
优先级等级:
继承 < 通配符选择器 < 标签选择器 < 类选择器 < id选择器 < 行内样式 < !important
注意点
1，!important写在属性值的后面,分号的前面！
2，!important不能提升继承的优先级,只要是继承优先级最低!
权重计算题解题步骤
1，先判断选择器是否能直接选中标签，如果不能直接选中 → 是继承，优先级最低 → 直接pass
2，通过权重计算公式，判断谁权重最高
权重计算公式
场景：如果是复合选择器，此时需要通过权重叠加计算方法，判断最终哪个选择器优先级最高会生效
复合选择器中:第一级(行内样式的个数),第二级(id选择器的个数),第三级(类选择器的个数),第四级(标签选择器的个数)
1，先比较第一级数字，如果比较出来了，之后的统统不看
2，如果第一级数字相同，此时再去比较第二级数字，如果比较出来了，之后的统统不看
3， ……
4， 如果最终所有数字都相同，表示优先级相同，则比较层叠性（谁写在下面，谁说了算!）
注意点：!important如果不是继承，则权重最 高，天下第一！
