CSS控制背景

1.背景 background:颜色 图片 平铺方式 固定方式 位置

2.背景颜色 background-color:#ccc;

3.背景图片 background-p_w_picpath:url(背景图像的位置及全称)

4.背景图像的平铺方式 background-repeat:repeat/no-repeat/repeat-x/repeat-y

5.背景图像的位置 background-position:top/center/bottom left/center/right

   x y //第一个值是水平位置，第二个值是垂直位置。左上角是0 0.单位是像素(0px 0px)

6.背景图片的依附方式 background-p_w_upload:scroll/fixed



注意：背景图片的依附方式中的值fixed在IE6中不支持。

      解决方法是IE6中HTML和BODY两个元素支持fixed这个值，

      所以要在IE6中让图片在屏幕某个位置不动，就得在HTML或BODY中设置background-p_w_upload:fixed;



background-position的两种设置方式：

background-position:center center;

background-position:100px 100px;



-------------------------------


css精灵


制作翻转按钮效果的两种方法：

1.我们需要两张图片，一张正常状态的图片，一张鼠标经过时的图片，

  这种按钮思路就是，设置链接a的背景为第一张图片，a:hover的背景为第二张背景图片


2.将两张图片合成一张图片，将这张在图片设置成背景，

  然后将a:hover的背景向上移动相应的像素即可。background-position



css精灵是用来优化网页的，因为可以减少http请求次数，提高网页效率。


css精灵的核心思想，就是将多张图片，合成一张图片，

然后通过背景属性中的定位来控制到底显示图片中的哪些部分。