background属性介绍
background属性在CSS中有较多的应用，主要用来设置背景颜色、图片。background属性可以分开写，也可以合并，建议合并减少代码量。
1. background-color：设置背景颜色；
设置的背景颜色会填充元素的内容、内边距和边框区域，扩展到元素边框的外边界（不包括外边距）。如果边框有透明部分（如虚线边框），会透过这些透明部分显示出背景色。颜色可以直接是颜色名称（red）、十六进制（#fff）、rgb（rbg（178,211,152）），inherit会继承父级的背景颜色。
2. background-image：设置背景图片；
背景图片占据元素的全部尺寸，包括内边距和边框，但不包括外边距。图片默认在盒子的左上角，若图片盒子尺寸大于图片尺寸，图片会在水平和垂直方向平铺。
| 值 | 描述 |
|---|---|
| url（‘’） | 指向图像路径 |
| none | 默认值，不显示背景图像 |
| inherit | 从父级继承background-image设置的属性 |
3. background-repeat：设置背景图片否平铺
设置是否平铺图像，默认在水平和垂直方向平铺。
| 值 | 描述 |
|---|---|
| repeat | 默认图片在水平和垂直方向平铺 |
| repeat-x | 水平方向平铺 |
| repeat-y | 垂直方向平铺 |
| no-repeat | 不平铺，只显示一次 |
| inherit | 继承父级元素设置的background-repeat属性 |
4. background-position：这只背景图片位置
设置图片水平位置：left、center、right
设置图片垂直位置：top、center、bottom
水平和垂直属性两两结合可以设置图片的位置在四个角、四个边的中心、盒子的正中心位置。还可以设置具体的像素值把背景图片精确的定位到盒子的某个位置，还可以用百分比设置图片的位置。
| 值 | 描述 |
|---|---|
| left、right 、top、center、bottom | 如果只设置了一个关键词，那么第二词默认是center |
| x%、y% | 第一个是水平位置，第二个是垂直位置。左上角是0%0%，右下角是100%100%。如果只设置了一个值，另一个默认50%。 |
| xpox、ypos | 第一个是水平位置，第二个是垂直位置。左上角是00，单位可以是px或其他CSS单位。若只规定了一个值，另一个值默认50%。%和position可以混合使用。 |
5. background-size：设置背景图片大小
6. background-attachment：设置背景图片是固定还是随着页面滚动条滚动
| 值 | 描述 |
|---|---|
| scroll | 默认值，图片会随着页面其余部分的滚动而移动 |
| fixed | 当页面的其余部分滚动时，背景图不会移动 |
| inherit | 继承父级元素设置的background-attachedt属性 |
7. background-origin
规定background-position属性相对于什么位置来定位。
ps：如果背景图设置background-attachment属性为“fixed”，则该属性没有效果。
| 值 | 描述 |
|---|---|
| padding-box | 背景图相对于内编辑框定位 |
| boder-box | 背景图相对于边框盒定位 |
| content-box | 背景图相对于内容框定位 |
属性合并设置不仅仅性能更好，而且兼容性好，减少了代码冗余。设置如下：
background：#fff url（‘1.jpg’） no-repeat left center fixed