背景尺寸屬性

• CSS3中新增的一個屬性, 專門用于設(shè)置背景圖片大小
• 格式：
• background-size:寬度 高度;
• 取值：
• 具體像素
• 百分比
• 寬度等比拉伸(auto 100px)
• 高度等比拉伸(100px auto)
• cover(1.告訴系統(tǒng)圖片需要等比拉伸2.告訴系統(tǒng)圖片需要拉伸到寬度和高度都填滿元素)
• contain(1.告訴系統(tǒng)圖片需要等比拉伸2.告訴系統(tǒng)圖片需要拉伸到寬度或者高度都填滿元素)

背景圖片定位區(qū)域?qū)傩?/h1>

• 告訴系統(tǒng)背景圖片從什么區(qū)域開始顯示
• 格式：
• background-origin
• 取值：
• padding-box（默認(rèn)情況下就是從內(nèi)邊距區(qū)域開始顯示）
• border-box（從邊框區(qū)域開始顯示）
• content-box（從內(nèi)容區(qū)域開始顯示）

背景繪制區(qū)域?qū)傩?/h1>

• 專門用于指定從哪個區(qū)域開始繪制背景的（背景顏色）
• 格式：
• background-clip
• 取值：
• padding-box（從內(nèi)邊距區(qū)域開始繪制背景）
• border-box(默認(rèn)情況下會從邊框區(qū)域開始繪制背景)
• content-box（從內(nèi)容區(qū)域開始繪制背景）

多重背景圖片

• 多張背景圖片之間用逗號隔開即可
• 例如：
  background-image:url("images/animal1.png"),url("images/animal2.png");
  background-repeat: no-repeat, no-repeat;
  background-position: left top, right top;
• 注意:
• 先添加的背景圖片會蓋住后添加的背景圖片
• 建議在編寫多重背景時拆開編寫