1.背景颜色属性:background-color
用于设置网页或网页元素的背景颜色,设置语法如下:
background-color:颜色的英文单词|颜色的十六进制数|颜色的RGB值|transparent|inherit;
语法说明:属性transparent用于设置透明背景,为默认的的背景颜色。
2. 背景图片属性:background-image
用于设置背景图片,设置语法如下:
background-image:url(image_file_path)|inherit;
其中image_file_path用于指定背景图片的路径,inherit继承父元素的background-image属性
3.背景图片重复属性:background-repeat
可以设置图片是否重复显示,设置语法如下:
background-repeat:repeat|erpeat-x|repeat-y|no-repeat|inherit;
参数说明:
属性值 | 描述 |
---|---|
repeat | 默认值,背景图片在水平方向和垂直方向都重复 |
repeat-x | 背景图片只在水平方向重复 |
repeat-y | 背景图片只在垂直方向重复 |
no-repeat | 背景图片只显示一次 |
inherit | 继承父级background-repeat的属性值 |
4. 背景图片位置属性:background-position
该属性可设置图片从某一个特定的位置开始显示,设置语法如下:
background-positon:表示位置的关键字|x% y%|xpos ypos;
注:偏移量为百分数,定位时折合为xpos ypos,其中xpos=(元素的宽度-背景图片的宽度)*x%,ypos=(元素的高度-背景图片的高度)y%.
5.背景图片滚动属性:background-attachment
该属性可以设置背景图片是否随着页面的滚动条滚动,设置语法如下:
background-attachment:scroll|fixed|inherit;
属性值 | 描述 |
---|---|
scroll | 默认值,背景图片会随着页面滚动条的滚动而移动 |
fixed | 页面滚动条滚动时,背景图片不会移动 |
inherit | 继承父元素的background-attachment |
6.背景属性:background
使用背景属性可以一次性地设置背景的所有样式,设置语法如下:
background: background-color|background-image[|background-position|background-repeat|background-attachment]
语法说明:各个属性值之间使用空格分隔,background必须有背景颜色或者背景图片,其余参数是可选参数,有需要就使用。