CSS - 背景，设置背景颜色，背景图片，背景图片的显示方式，背景图片的起始位置，背景是否滚掉，背景大小

1.设置背景颜色

background-color: pink;

background-color: rgb(255,192,203);

/*第四个参数是设置透明度*/
background-color: rgba(255,192,203,0.5);

 

2.设置背景图片

background-image: url("图片地址");

 

3.背景图片的显示方式

background-repeat: repeat;

repeat 背景图像将在垂直方向和水平方向重复 默认值，no-repeat 背景图像将仅显示一次 

repeat-x 背景图像将在水平方向重复，repeat-y 背景图像将在垂直方向重复

 

4.图片的起始位置

background-position: top 10px left 10px;
        
background-position: top 10% left 10%;

第一个参数只能是：top，center，bottom，第二个参数只能是：left，right，center

第一个参数控制 上，中，下，第二个参数控制 左，中，右。后面跟参数是指偏移多少，一般不跟参数

 

5.背景图片是否随着页面滚动

background-attachment: scroll;

background-attachment: fixed;

scroll 滚动 默认值，fixed 固定

 

6.设置背景图片大小

/*当只设置宽度时 高度为auto 图片不变形*/
background-size: 400px;
background-size: 100%;

/*设置背景图片的宽度与高度*/
background-size: 400px 400px;
background-size: 100% 100%;

cover 把背景图像扩展至足够大，以使背景图像完全覆盖背景区域，背景图像的某些部分也许无法显示在背景定位区域中。

contain 把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域。

 

7.复合写法

background: 颜色 设置图片 设置图片的显示方式 设置是否滚动 设置起始位置;