### background-origin
> `background-origin`設置元素背景圖片的原始起始位置。
```css
background-origin: border-box | padding-box | content-box;
```
參數分別表示背景圖片是從邊框，還是內邊距（默認值），或者是內容區域開始顯示。
需要注意的是，如果背景不是no-repeat，這個屬性無效，它會從邊框開始顯示。
### background-clip
> 用來將背景圖片做適當的裁剪以適應實際需要。
```css
background-clip: border-box | padding-box | content-box | no-clip
```
參數分別表示從邊框、或內填充，或者內容區域向外裁剪背景。no-clip表示不裁切，和參數border-box顯示同樣的效果。backgroud-clip默認值為border-box。
### background-size
設置背景圖片的大小，以長度值或百分比顯示，還可以通過cover和contain來對圖片進行伸縮。
```css
background-size: auto | <長度值> | <百分比> | cover | contain
```
1. auto：默認值，不改變背景圖片的原始高度和寬度；
2. <長度值>：成對出現如200px 50px，將背景圖片寬高依次設置為前面兩個值，當設置一個值時，將其作為圖片寬度值來等比縮放；
3. <百分比>：0％~100％之間的任何值，將背景圖片寬高依次設置為所在元素寬高乘以前面百分比得出的數值，當設置一個值時同上；
4. cover：顧名思義為覆蓋，即將背景圖片等比縮放以填滿整個容器；
5. contain：容納，即將背景圖片等比縮放至某一邊緊貼容器邊緣為止。
### multiple backgrounds
> 多重背景，也就是CSS2里background的屬性外加origin、clip和size組成的新background的多次疊加，縮寫時為用逗號隔開的每組值；用分解寫法時，如果有多個背景圖片，而其他屬性只有一個（例如background-repeat只有一個），表明所有背景圖片應用該屬性值。
```css
background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],...
```
可以把上面的縮寫拆解成以下形式：
```css
background-image:url1,url2,...,urlN;
```
```css
background-repeat : repeat1,repeat2,...,repeatN;
backround-position : position1,position2,...,positionN;
background-size : size1,size2,...,sizeN;
background-attachment : attachment1,attachment2,...,attachmentN;
background-clip : clip1,clip2,...,clipN;
background-origin : origin1,origin2,...,originN;
background-color : color;
```
注意：
1. 用逗號隔開每組 background 的縮寫值；
2. 如果有 size 值，需要緊跟 position 并且用 "/" 隔開；
3. 如果有多個背景圖片，而其他屬性只有一個（例如 background-repeat 只有一個），表明所有背景圖片應用該屬性值。
4. background-color 只能設置一個。
