1、背景图
作用：网页中，使用背景图实现装饰性的图片效果。
属性名：background-image（bgi）
属性值：url（背景图URL)
注：背景图默认是平铺的效果！
2、背景图平铺方式
属性名：background-repeat（bgr）
属性值：
| 属性值 | 效果 |
| no-repeat | 不平铺 |
| repeat | 平铺（默认效果） |
| repeat-x | 水平方向平铺 |
| repeat-y | 垂直方向平铺 |
例子：
使用下面方式前：
代码：
结果：
①no-repeat（盒子左上角显示一张背景图）
代码：
结果：
②repeat
代码：
结果：
③repeat-x
代码：
结果：
④repeat-y
代码：
结果：
3、背景图位置
属性名：background-position
属性值：水平方向位置，垂直方向位置
例：左上角
background-position：0 0；
或background-position：left top；
①关键字
| 关键字 | 位置 |
| left | 左侧 |
| right | 右侧 |
| center | 居中 |
| top | 顶部 |
| bottom | 底部 |
②坐标（数字+px，正负都可以）
水平：正数向右，负数向左
垂直：正数向下，负数向上
③提示：a、关键字取值方式写法，可以颠倒取值顺序；
b、可以只写一个关键字，另一个方向默认为居中；数字只写一个值表示水平方向，垂直方向居中。
4、背景图缩放
作用：设置背景图大小
属性名：background-size（bgz）
常用属性值：
①关键字
cover：等比例缩放背景图片以完全覆盖背景区，可能背景图片部分看不见；
contain：根据盒子尺寸计算图片大小（如果图的宽度跟盒子尺寸相等停止缩放，可能导致盒子有露白）。
②百分比：根据盒子尺寸计算图片大小
数字+单位（例如：px）
注：100%图片的宽度跟盒子宽度一样，图片的高度按照图片比例等比缩放。
5、背景图固定
作用：背景不会随着元素的内容滚动。
属性名：background-attachment（bga）
属性值：fixed
6、背景属性——复合写法
背景名：background（bg）
属性值：背景色 背景图 背景平铺方式 背景图位置/背景图缩放 背景图固定（空格隔开各个属性值，不区分顺序）
标签：平铺,repeat,缩放,背景,background,背景图,CSS,属性 From： https://blog.csdn.net/k_k_kkh/article/details/143464174