background用于在一个背景中设置背景属性,像css其他属性一样,有两种表示方法
- 简写形式,如border:1px solid #ccc;
- 具体形式,如border-width:10px;
1.css属性:
background-color/*背景颜色*/
background-image/*背景图片*/
background-repeat/*设置背景图像是否重复,及如何重复*/
background-attachment/*背景图像是否固定或者随着页面的其余部分滚动*/
background-position/*设置背景图像的起始位置*/
background/*简写属性*/
2、具体形式
1.background-color
用于设置背景颜色,默认元素背景色为透明(transparent)
一共三种表示法,如下:
background-color: red;
background-color: #ccc;
background-color: rgb(255, 255, 255);
2.background-image
设置背景图片,默认无图片
background-image: url(img.png);
3.background-position
设置背景图片的位置,相对于元素进行定位,默认位置左上角(0,0),可以用的表示方法
- 数值表示,如(10px,10px);
- 百分比表示,如(10%, 10%);
-
方向位置表示法,
left top:左上
left center:左中
left bottom:左下
right top:右上
right center:右中
right bottom:右下
center top:居中置顶
center center:水平垂直居中
center bottom:居中置底
注意:使用该属性,background-attachment必须设置为 “fixed(固定)”.
body
{
background-image:url('background.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
}