閱讀(59.5k) 書(shū)簽贊(4) 我要糾錯(cuò)

CSS background 屬性

2022-06-02 14:29 更新

CSS background 屬性

標(biāo)簽定義及使用說(shuō)明

背景縮寫(xiě)屬性可以在一個(gè)聲明中設(shè)置所有的背景屬性。

可以設(shè)置的屬性分別是：background-color, background-position, background-size, background-repeat, background-origin, background-clip, background-attachment,和background-image.

如果上述值缺少一個(gè)，這不要緊，例如background：＃FF0000 URL（smiley.gif）;是允許的。

默認(rèn)值:	請(qǐng)參閱單獨(dú)的屬性
繼承:	no
版本:	CSS1+ CSS3中的新的屬性
JavaScript 語(yǔ)法:	object object.style.background="red url(smiley.gif) top left no-repeat"

語(yǔ)法

background:bg-color bg-image position/ bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;

值	說(shuō)明	CSS
background-color	指定要使用的背景顏色	1
background-position	指定背景圖像的位置	1
background-size	指定背景圖片的大小	3
background-repeat	指定如何重復(fù)背景圖像	1
background-origin	指定背景圖像的定位區(qū)域	3
background-clip	指定背景圖像的繪畫(huà)區(qū)域	3
background-attachment	設(shè)置背景圖像是否固定或者隨著頁(yè)面的其余部分滾動(dòng)。	1
background-image	指定要使用的一個(gè)或多個(gè)背景圖像	1

實(shí)例

在一個(gè)div元素中設(shè)置多個(gè)背景圖像（并指定他們的位置）：

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

嘗試一下 ?

瀏覽器支持

表格中的數(shù)字表示支持該屬性的第一個(gè)瀏覽器版本號(hào)。

緊跟在 -webkit-, -ms- 或 -moz- 前的數(shù)字為支持該前綴屬性的第一個(gè)瀏覽器版本號(hào)。

屬性
background	1.0	4.0	1.0	1.0	3.5

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

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

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

CSS background 屬性

CSS background 屬性

標(biāo)簽定義及使用說(shuō)明

語(yǔ)法

實(shí)例

實(shí)例

瀏覽器支持

相關(guān)文章