Style background 属性

定义和用法

background 属性以简写形式设置或返回最多八个单独的背景属性。

通过此属性，您可以设置/返回以下一项或多项（以任意顺序）：

上面的属性也可以使用单独的样式属性进行设置。强烈建议非高级作者使用单独的属性以获得更好的可控性。

另请参阅：

CSS 教程：CSS 背景

CSS3 教程：CSS3 背景

CSS 参考手册：background 属性

实例

设置文档的背景的样式：

document.body.style.background = "#f3f3f3 url('img_tree.png') no-repeat right top";

亲自试一试

页面下方有更多 TIY 实例。

语法

返回 background 属性：

object.style.background

设置 background 属性：

object.style.background = "color image repeat attachment position size origin clip|initial|inherit"

属性值

技术细节

更多实例

例子 2

更改 DIV 元素的背景：

document.getElementById("myDIV").style.background = "url('smiley.gif') blue repeat-x center";

亲自试一试

例子 3

为文档设置背景颜色：

document.body.style.backgroundColor = "red";

亲自试一试

例子 4

为文档设置背景图像：

document.body.style.backgroundImage = "url('img_tree.png')";

亲自试一试

例子 5

将背景图像设置为不重复：

document.body.style.backgroundRepeat = "repeat-y";

亲自试一试

例子 6

将背景图像设置为固定（不会滚动）：

document.body.style.backgroundAttachment = "fixed";

亲自试一试

例子 7

更改背景图像的位置：

document.body.style.backgroundPosition = "top right";

亲自试一试

例子 8

返回文档的背景属性值：

document.body.style.background;

亲自试一试

浏览器支持

background 是 CSS1 (1996) 特性。

所有浏览器都完全支持它：

注释

CSS3 (1999) 中添加了三个新属性：

• background-clip

• background-origin

• background-size