背景(background)

内容可以把容器的宽高撑起来,背景不会占用容器的宽高

• background-color 背景色

     red:             颜色的英文表示
     #f00:            颜色的十六进制表示
     rgb(255,0,0):    颜色的RGB表示方法  在CSS3中rgba(255,0,0,0.5) 第四个参数表示透明度 
     transparent      背景透明(默认值为透明)  
  

  例:background-color: green;

• background-image 背景图片

     url(图片地址)
     none 默认值
  

例:background:url(点点.jpg);

ps:路径:      
绝对路径         从磁盘出发的路径
相对路径         相对于网页文件的路径
域名路径         使用网络域名的路径

• background-repeat 背景图片是否重复平铺

     background-repeat: no-repeat;  //背景图片不进行平铺
     background-repeat: repeat-x;   //背景图沿着x轴平铺
     background-repeat: repeat-y;   //背景图沿着Y轴平铺
     background-repeat: repeat;    //全部平铺(默认值)
  

• background-position 背景图片的位置

  两种形式的值
     传参数：背景图离左上角的距离
        x：正 向容器右边走的距离
           负 向容器左边走的距离
        y：正 向容器下边走的距离
           负 向容器的上边的距离
     传关键字
        x:left    图片在容器的左边
          center  图片在容器的中间
          right   图片在容器的右边
        y:top     图片在容器的上边
          center  图片在容器的中间 
          bottom  图片在容器的下边
        如果只传一个值的话，另外一个默认是center
        如果两个值都不写的话，则默认为(0,0)点   ,即左上角
  

例:background-position:20px 30px;//图片向右移动20像素，向下移动30px

• background-attachment 背景图片是否滚动

     scroll   背景图随滚动条滚动(默认)
     fixed    背景图不会随着滚动条滚动
  

• 背景的复合式写法：

  background: green url(点点.jpg) no-repeat center top;//背景为绿色，加入图片，图片不重复平铺，图片的x方向上居中，图片的y方向上居上。