CSS 參考手冊

CSS @規(guī)則(RULES)

CSS 屬性大全

CSS background-attachment 屬性 CSS3 backface-visibility 屬性

CSS background 屬性使用方法及示例

CSS background屬性是用于設(shè)置各個背景屬性的簡寫屬性，即一個簡寫速記屬性，而 background-image，background-position，background-size，background-repeat，background-attachment，background-origin，background-clip和background-color 這些單一的屬性聲明。

下表總結(jié)了此屬性的用法上下文和版本歷史記錄。

默認(rèn)值：	查看所有屬性值
適用于：	所有元素
繼承：	沒有
可動畫制作：	是的，因為速記的某些屬性可以設(shè)置動畫。請參考動畫屬性。
版本：	CSS 1，2，3
JavaScript 語法:	object object.style.background="red url(smiley.gif) top left no-repeat"

background 背景的使用語法

該屬性的語法如下：

background: [ image position/size repeat attachment origin clip color ] | initial | inherit

注意：如果上面列出的任何屬性均缺失或省略，則將插入該屬性的默認(rèn)值（如果有的話）。有關(guān)詳細(xì)信息，請參見各個屬性。

下面的示例演示了如何使用background屬性。

示例

body {background: #ffff00 url("smiley.png") no-repeat fixed center;}

測試看看?/?

在CSS3中，您還可以將多個背景添加到單個元素。背景沿著z軸彼此重疊。

示例

.box {
    width: 100%;
    height: 500px;
    background: url("images/birds.png") no-repeat center,url("images/clouds.png") no-repeat center,lightblue;
}

測試看看?/?

屬性值

下表描述了此屬性的值。

值	描述
background-attachment	指定背景是隨文檔滾動還是保持固定在查看區(qū)域。
background-color	設(shè)置元素的背景色。
background-clip	指定繪制背景的區(qū)域。
background-image	為一個元素設(shè)置一個或多個背景圖像。
background-origin	指定背景圖像的定位區(qū)域。
background-position	設(shè)置背景圖像的初始位置。
background-repeat	指定背景圖像的大小和位置后如何平鋪。
background-size	指定背景圖像的大小。
initial	將此屬性設(shè)置為其默認(rèn)值。
inherit	如果指定，則關(guān)聯(lián)元素采用其父元素background屬性的計算值。

瀏覽器兼容性

background屬性瀏覽器的兼容性，所有主流瀏覽器均支持該屬性。

	Firefox 1+ Google Chrome1+ Internet Explorer 4+ 蘋果Safari 1+ Opera 3.5+

進(jìn)一步閱讀

請參考以下教程：CSS背景，CSS3背景。

CSS background-attachment 屬性 CSS3 backface-visibility 屬性