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 語法: | object object.style.background="red url(smiley.gif) top left no-repeat" |
語法
background:bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
值 | 說明 | 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