CSS background 属性
更新于 2024/6/15 9:43:00
❮ CSS backface-visibility 属性
CSS 参考手册
CSS background-attachment 属性 ❯
实例
在一个声明中设置不同的背景属性:
body
{ background: lightblue url("img_tree.gif") no-repeat fixed center;
}
亲自试一试 »
定义和用法
background 简写属性在一个声明中设置所有的背景属性。
可以设置如下属性:
background-color
background-image
background-position
background-size
background-repeat
background-origin
background-clip
background-attachment
如果不设置其中的某个值,也不会出问题,比如 background:#ff0000 url(smiley.gif); 也是允许的。
默认值:
请参阅单独的属性
继承性:
no
支持动画:
yes, 请参阅单独的属性. 阅读有关动画的信息
测试一下
版本:
CSS1 + new properties in CSS3
JavaScript 语法:
object.style.background="red url(smiley.gif) top left no-repeat"
测试一下
浏览器支持
表中的数字表示支持该属性的第一个浏览器版本。
属性
background
1.0
4.0
1.0
1.0
3.5
注释: 请参见下面每个值的单个浏览器支持。
语法
background: bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
/* 使用 background-color */
background: green;
/* 使用 bg-imag> 和 repeat-style */
background: url("test.jpg") repeat-y;
/* 使用 box 和 background-color */
background: border-box red;
/* 将背景设为一张居中放大的图片 */
background: no-repeat center/80% url("../img/image.png");
background 属性被指定多个背景层时,使用逗号分隔每个背景层。
每一层的语法如下:
在每一层中,下列的值可以出现 0 次或 1 次:
注意: background-color 只能在background的最后一个属性上定义,因为整个元素只有一种背景颜色。
属性值
值
描述
CSS
background-color
指定要使用的背景颜色
1
background-image
指定要使用的一个或多个背景图像
1
background-position
指定背景图像的位置
1
background-size
指定背景图片的大小
3
background-repeat
指定如何重复背景图像
1
background-origin
指定背景图像的定位区域
3
background-clip
指定背景图像的绘画区域
3
background-attachment
设置背景图像是否固定或者随着页面的其余部分滚动。
1
initial
将此属性设置为其默认值。请参阅 initial
3
inherit
从其父元素继承此属性。请参阅 inherit
2
相关页面
CSS 教程: CSS 背景, CSS 背景(高级)
HTML DOM 参考手册: background 属性
❮ CSS backface-visibility 属性
CSS 参考手册
CSS background-attachment 属性 ❯