CSS 可以添加背景顏色和背景圖片，以及來進行圖片設置。 |屬性| 作用 | | --- | --- | | background-color | 背景顏色 | | background-image | 背景圖片地址 | | background-repeat | 是否平鋪 | | background-position | 背景位置 | | background-attachment | 背景固定還是滾動 | | 背景的合寫（復合屬性）| `background:背景顏色 背景圖片地址 背景平鋪 背景滾動 背景位置` | [TOC] ## 1. 背景圖片(image) 語法： ```css background-image : none | url (url) /* 提倡 背景圖片后面的地址，url不要加引號 */ ``` `background-image` 屬性允許指定一個圖片展示在背景中（只有CSS3才可以多背景），可以和 `background-color `連用。 如果圖片不重復地話，圖片覆蓋不到的地方都會被背景色填充。 如果有背景圖片平鋪，則會覆蓋背景顏色。 <br/> ## 2. 背景平鋪（repeat） 語法： ```css background-repeat : repeat | no-repeat | repeat-x | repeat-y ``` 參數： repeat : 　背景圖像在縱向和橫向上平鋪（默認的） no-repeat : 　背景圖像不平鋪 repeat-x : 　背景圖像在橫向上平鋪 repeat-y : 　背景圖像在縱向平鋪 設置背景圖片時，默認把圖片在水平和垂直方向平鋪以鋪滿整個元素：  <br/> ## 3. 背景位置(position) 語法： ```css background-position : x y; /* x, y可以是像素、%、方位名詞top left right bottom */ ``` * 設置背景圖像位置。必須先指定background-image屬性。默認值為：(0% 0%)。 如果只指定了一個值，該值將用于橫坐標。縱坐標將默認為50%。第二個值將用于縱坐標。 * 如果精確單位和方位名字混合使用，則必須是x坐標在前，y坐標后面。比如 background-position: 15px top; 則 15px 一定是 x坐標 top是 y坐標。 實際工作用的最多的，就是背景圖片居中對齊了。 <br/> ## 4. 背景附著 語法： ```css background-attachment : scroll | fixed ``` scroll : 　背景圖像是隨對象內容滾動 ， fixed : 　背景圖像固定。<br/> <br/> ## 5. 背景簡寫 background屬性的值的書寫順序官方并沒有強制標準的。為了可讀性，建議大家如下寫： ```css background:背景顏色 背景圖片地址 背景平鋪 背景滾動 背景位置 ``` <br/> ## 6. 背景透明 CSS3支持背景透明的寫法語法格式是: ```css background: rgba(0,0,0,0.3); ``` 最后一個參數是alpha 透明度 取值范圍 0~1之間 注意： 背景半透明是指盒子背景半透明， 盒子里面的內容不收影響。