background的属性
1. background-color :
这个属性用于设置一个元素的背景颜色
2. background-position :
这个属性设置背景图片的起始位置（注意对于这个工作在Firefox和Opera，background-attachment必须设置为 "fixed（固定）".）
3. background-size :
这个属性指定背景图片的大小
关于cover和contain的区别（整理总结自CSDN哈姆PP）
cover 保持宽高比，铺满整个容器宽高，多出的部分会被裁切，不显示
contain 保持宽高比，缩放到图片完全展示，会有留白部分
ps: cover意为“遮盖，覆盖物”，可以理解为"铺满"，铺满了容器多出的部分也就可以不要了；contain意为“包含，容纳”，把图片包含其中，要显示全部
4. background-repeat :
默认是图片会重复填满元素，沿X和Y方向填满，可以设置成单独X或Y方向 repeat-x || repeat-y；设置no-repeat则只出现一次
5. background-origin ：
这个属性指定background-position属性应该相对的位置（注意如果背景图像background-attachment是"固定"，这个属性没有任何效果 ）origin意为起源
6. background-clip ：
这个属性指定背景绘制区域
background-clip 与 background-origin的区别
前者是对背景图片进行裁剪，后者是对背景图片设置起始点
对于background-clip, 其关键字是指将背景图片以border的尺寸、以padding的尺寸，以content的尺寸进行切割，其得到的结果是不完整的背景，也就是其中的一部分(原理与截图差不多)。而且有一点要注意，background-clip的切割是对这个容器背景的切割(包括图片与背景颜色)。
对于background-origin，其关键字是指将背景图片放置到border范围内，padding范围内、content范围内，其得到的结果是完整的背景(原理与图片的缩放相似)。与background-clip不同的是，它只是单纯设置背景图片的边界，并不会对背景颜色造成影响。
详见 https://blog.csdn.net/linwh8/article/details/52636340
7. background-attachment ：
这个属性设置背景图像是否固定或者随着页面的其余部分滚动。
background-attachment:fixed 即为背景图片是固定，不随页面滚动的（可以完成不随页面滚动的背景图片效果）
8. background-image :
background-image属性设置一个元素的背景图像。
元素的背景是元素的总大小，包括填充和边界（但不包括边距）。
默认情况下，background-image放置在元素的左上角，并重复垂直和水平方向。
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，可以使用背景色带代替。
