Latest web development tutorials

CSS background 屬性

實例

在一個div元素中設置多個背景圖像(並指定他們的位置):

body
{
background: #00ff00 url('smiley.gif') no-repeat fixed center;
}

嘗試一下»

瀏覽器支持

表格中的數字表示支持該屬性的第一個瀏覽器版本號。

緊跟在-webkit-, -ms- 或-moz- 前的數字為支持該前綴屬性的第一個瀏覽器版本號。

属性
background 1.0 4.0 1.0 1.0 3.5

所有主要瀏覽器都支持background屬性。

注意 IE8和更早版本不支持一個元素多個背景圖像。

注意 IE7和更早的版本不支持"繼承"的值。IE8需要定義! DOCTYPE。 IE9支持"繼承"。


標籤定義及使用說明

背景縮寫屬性可以在一個聲明中設置所有的背景屬性。

可以設置的屬性分別是:background-color, background-position, background-size, background-repeat, background-origin, background-clip, background-attachment,和background-image.

如果上述值缺少一個,這不要緊,例如background:#FF0000 URL(smiley.gif);是允許的。

默認值: 請參閱單獨的屬性
繼承: no
版本: CSS1+ CSS3中的新的屬性
JavaScript 語法: objectobject.style.background="red url(smiley.gif) top left no-repeat"


語法

background:color position size repeat origin clip attachment image;

說明 CSS
background-color 指定要使用的背景顏色 1
background-position 指定背景圖像的位置 1
background-size 指定背景圖片的大小 3
background-repeat 指定如何重複背景圖像 1
background-origin 指定背景圖像的定位區域 3
background-clip 指定背景圖像的繪畫區域 3
background-attachment 設置背景圖像是否固定或者隨著頁面的其餘部分滾動。 1
background-image 指定要使用的一個或多個背景圖像 1


相關文章

CSS教程: CSS Background

CSS3教程: CSS3 Backgrounds