CSS背景可以实现纯色，渐变色，和图片；

　　纯色背景比较简单：

background-color:red;

　　red为颜色值，颜色值具有以下几种表示方法：

　　·　　十六进制：　　　#ffffff；

　　·　　rgb： 　　　　　rgb(0，0，255)；

　　·　　rgba：　　　　　rgba(0,0,0,0.5);　　　　//相对于rgb增加了透明度属性，该属性为opacity值，从0到1；

　　·　　hsl：　　　　　　hsl(120,30%,30%);　　//色调（0-360），饱和度，明度；

　　`　　hsla:　　　　　　hsla(120,30%,30%,0.3);

　　`　　name:　　　　　　red / blue / green / purple / yellow / black /```;

 

 

　　渐变色背景和纯色背景用法一样，但存在兼容性问题，单独讨论，故这里暂不做解释；

 

 

　　图片背景,

　　　　background-image:

　　　　　　url(img/img.jpg);

　　　　　　通常情况下，我们的css代码会写在单独的css文件中，而css文件又放在专门的文件夹中（即与html文件不在同一个目录），这时候在使用相对路径的url时，是从css文件所在的路径开始，然后相对的定位图片所在的位置，如果以html文件为出发点，就会找不到图片而使背景图片失效；

　　　　background-repeat:

　　　　　　no-repeat  /  repeat-x  /  repeat-y  /  repeat;

 

　　　　background-position:

　　　　　　top left  /  20%  30%  /  两个带单位的具体数值；

 

　　　　background-attachment:

　　　　　　fixed  /  scroll  /  inherit;

 

　　　　background-clip:    //背景绘制区域；

　　　　　　border-box  /  padding-box  /  content-box;

 

　　　　background-origin:    //背景图片定位区域;

　　　　　　border-box  /  padding-box  /  content-box;

 

　　　　background-size:

　　　　　　120px 120px;

　　　　　　30% 30%;

　　　　　　cover;　　　　//保持原比例使图像填满背景区域，超出部分将不被显示；即图片完全覆盖背景区域；

　　　　　　contain;　　　　//保持原比例，在背景区域中进行最大图像显示；即图像包含在背景区域中；