背景缩放background-size和背景图片background

background-size 属性规定背景图像的尺寸

单位： 长度|百分比|cover|contain;

cover:会以短边为准，直至短边和盒子重合，cover把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。（等比例拉伸，完全覆盖，会有一边超出）

contain:以长边为准，只要触及父盒子边缘即不在扩展，contain把图像图像扩展至最大尺寸，以使其宽度或高度完全适应内容区域。（等比例拉伸，任意一边先与盒子重合即可，可能有部分空白区域）

background: #00FF00 url(bgimage.gif) no-repeat fixed top;

• background-color                    规定要使用的背景颜色
• background-position                规定背景图像的位置。

   

   

   

• background-size      规定背景图片的尺寸。
• background-repeat  规定如何重复背景图像。
• 

   

   

• background-origin      background-origin 属性规定 background-position 属性相对于什么位置来定位。 注释：如果背景图像的 background-attachment 属性为 "fixed"，则该属性没有效果。
• background-clip
• 

   

   

• background-attachment     设置背景图像是否固定或者随着页面的其余部分滚动
• 

   

   

• background-image

• 背景渐变

• background: linear-gradient(起始方向, 颜色1, 颜色2, ...);

•  例子 background: -webkit-linear-gradient(left, red , blue);
  background: -webkit-linear-gradient(left top, red , blue);