CSS背景屬性主要有以下幾個
| 屬性 | 描述 |
| background-color | 設定背景顏色 |
| background-image | 設定背景圖片 |
| background-position | 設定背景圖片顯示位置 |
| background-repeat | 設定背景圖片如何填充 |
| background-size | 設定背景圖片大小屬性 |
1、background-color屬性
該屬性設定背景顏色
<div class="a1"> </div>
.a1{
width: 400px;
height: 400px;
background-color: red;
或者 background-color:#ff0000;
}
2、background-image屬性
設定元素的背景影像
元素的背景是元素的總大小，包括填充和邊界（不包括外邊距）。預設情況下background-image屬性放置在元素的左上角，如果影像不夠大的話會在垂直和水平方向平鋪影像，如果影像大小超過元素大小從影像的左上角顯示元素大小的那部分
<div class="a2"></div>
.a2{
width: 400px;
height: 400px;
background-image: url("圖片位置");
}
3、background-repeat屬性
該屬性設定如何平鋪背景影像
| 值 | 說明 |
| repeat | 預設值 |
| repeat-x | 只向水平方向平鋪 |
| repeat-y | 只向垂直方向平鋪 |
| no-repeat | 不平鋪 |
4、background-size屬性
該屬性設定背景影像的大小
| 值 | 說明 |
| lenght | 設定背景圖片的寬度和高度，第一個值寬度，第二個值高度，如果只是設定一個，第二個值auto |
| percentage |
計算相對位置區域的百分比，第一個值寬，第二個值高度，如果只是設定一個，第二個值auto |
| cover | 保持圖片縱橫比 並將圖片縮放成完全覆蓋背景區域的 最小大小 |
| contain | 保持圖片縱橫比 並將影像縮放成適合背景定位區域的 最大大小 |
常用，不變形，會切割
不會切割
5、background-positon屬性
該屬性設定背景影像的起始位置，其預設值是：0% 0%
| 值 | 說明 |
| left top | 左上角 |
| left center | 左 中 |
| left bottom | 左 下 |
| right top | 右上角 |
| right center | 右 中 |
| right bottom | 右 下 |
| center top | 中 上 |
| center center | 中 中 |
| center bottom | 中 下 |
| x% y% |
第一個是水平位置，第二個是垂直位置，左上角是0% 0%，右下角是100% 100%。 如果只指定了一個值，其他值預設是50% 。 預設是0% 0% |
| xpos ypos |
單位是畫素 |
