使用CSS3，您可以將多個(gè)背景應(yīng)用于元素。
CSS3提供了幾個(gè)新屬性來操縱元素的背景，例如背景剪切，多個(gè)背景以及調(diào)整背景大小的選項(xiàng)。
下一節(jié)將向您介紹CSS3的所有新背景功能，有關(guān)其他與背景相關(guān)的屬性，請(qǐng)查看CSS背景教程。
該background-size屬性可用于指定背景圖像的大小。在CSS3之前，背景圖片的大小由圖片的實(shí)際大小決定。背景圖像的大小可以使用像素或百分比值，以及關(guān)鍵字來指定auto，contain和cover。不允許使用負(fù)值。
.box {
width: 250px;
height: 150px;
background: url("images/sky.jpg") no-repeat;
background-size: contain;
border: 6px solid #333;
}測(cè)試看看?/?提示：該background-size屬性通常用于創(chuàng)建全尺寸背景圖像，該背景圖像將根據(jù)瀏覽器的視口或?qū)挾鹊拇笮∵M(jìn)行縮放。
background-clip屬性可用于指定元素的背景是否延伸到邊框中。該background-clip屬性可以取三個(gè)值：border-box，padding-box，content-box。
.box {
width: 250px;
height: 150px;
padding: 10px;
border: 6px dashed #333;
background: orange;
background-clip: content-box;
}測(cè)試看看?/?請(qǐng)參考CSS盒模型教程，以了解有關(guān)元素盒子的更多信息。
該background-origin屬性可用于指定背景圖像的定位區(qū)域。它可以采取相同的值background-clip屬性：border-box，padding-box，content-box。
.box {
width: 250px;
height: 150px;
padding: 10px;
border: 6px dashed #333;
background: url("images/sky.jpg") no-repeat;
background-size: contain;
background-origin: content-box;
}測(cè)試看看?/?注意：如果background-attachment屬性的值被指定為“fixed”，那么background-origin屬性將被忽略。
CSS3使您能夠?qū)⒍鄠€(gè)背景添加到單個(gè)元素。背景相互層疊在一起。層數(shù)由background-imageor background速記屬性中的逗號(hào)分隔值的數(shù)目確定。
.box {
width: 100%;
height: 500px;
background: url("images/birds.png") no-repeat center, url("images/clouds.png") no-repeat center, lightblue;
}測(cè)試看看?/?背景的逗號(hào)分隔列表中的第一個(gè)值（即background-image“ birds.png”）將顯示在頂部，而最后一個(gè)值（即“ lightblue”顏色）將顯示在底部。只有最后一個(gè)背景可以包含background-color。