background
background 的幾個屬性回顧一下，而且還有css3 的幾個屬性。
-----------------------------------------------------------------------------------------------------------------
設置背景顏色 支持 單詞 ，十六進制正整數 #ff0 rgb rgba hsl hsla transparent
設置一張圖片，或者多張背景圖片
一般的話，也沒有人 使用background-image 來放兩張圖片，在網絡不好的情況下，有可能 圖片顯示不出來， 那么我們不能留個空位給 用戶看吧。所以，這個時候，你可以再設置多一張圖片，用來，第一張圖片顯示不出來的時候占位
設置圖片是否平鋪，和平鋪的效果
參數：
repeat-x repeat-y repeat no-repeat 這一行值， 只能設置一個。
round space 這一行值，可以設置一個 或 兩個 第一個值代表橫向， 第二個值代表 縱向。 如果只設置了一個值，那么這個值會 應用於 橫向 和 縱向
默認值是：repeat 表示在 橫向， 和縱向 都平鋪
round：
當背景圖像不能以整數次平鋪時，會根據情況縮放圖像。也就是說，如果圖片平鋪的大小不能再添加一個圖片進去， 會壓縮，或者拉伸其他圖片。
記得這個 round 會 拉伸，或者 壓縮圖片就行， space,他不會拉伸圖片， 但是有空白區域
space
不夠填充的 地方， 有空白區域， 但是不會拉伸圖片。
根據容器來定位 圖片的位置。 默認值是：0% 0% ， 第一個值設置 left 第二個值設置 top。 如果只設置一個值， 第二個值默認是 center
可以接受 定位 第二張圖片， 第三張圖片的寫法， 只需要加個 ，號 例如 ： background-position: 0 0 , 10px 10px
定義滾動時背景圖像相對於誰固定
參數：
scroll：其實很像 position: 的 fixed 效果。 看下面的 gif 圖就知道啦。
local：也很像 position：的 absolute 。 也是觀看下面的 gif圖啦。
還有一個參數， fixed。他會根據 瀏覽器的窗口定位。 所以下面的設置， 我把位置調到了 剛好在div 容器里面。來看一下他的效果吧
從哪里開始顯示背景圖片。說的是， 從 border 還是 padding 還是 content 呢。 默認值是 padding
參數：border-box padding-box content-box 從什么地方開始顯示圖片
從哪里截掉圖片。 跟上面一樣， 不過 默認的是 border
參數：border-box padding-box content-box text 從什么地方 截掉圖片。 text(是webkit獨有的)
其實呢，造成這種效果， 是因為 平鋪造成的， 所以把平鋪 設置成 no-repeat 看看， 然后你就會驚奇的發現， 上 左兩條邊框里面沒有東西， 但是 下 右邊框里面有東西。
還有最后一個值： text 這個值呢， 只有webkit內核的瀏覽器可以使用。 搭配 text-fill-color(也只有webkit內核的瀏覽器有) 使用。
參數：50% 50% (px)， 根據自身的需求 設置。
auto: 背景圖片的真實大小(默認值)
cover: 將背景圖片等比例縮放到完全覆蓋容器大小。 有可能背景圖片大小會超出容器。
contain：將背景圖片等比例縮放到寬度或高度與容器相等的一邊。背景圖片一定會在里面， 不會超出。 但是有可能寬或高不夠出現空白區域
什么意思的，看看下面的例子：
