用css进行网页背景位置控制

          一、css定位图片显示位置 background-position

 　　一张背景图片经过上面的设置后往往还不够的，因为当你使用上面的不重复显示设置后，图片只显示在页面的左上角，而不会在其它地方，可是如果要在中间或者其它地方出现这张背景图片的话，那么background-position这个就可以帮你了，因为它就是用来显示图片相对于左上角的一个位置的（就是默认的值0% 0%），由两个值来设定，中间用空格来隔开。它的主要的几个值有left|center|right和top|center|bottom，也可以用百分数值指定相对位置或用一个值来指定绝对位置，如50%表示的位置是在中心，而50px的水平值则表示图片距左上角区域水平移动50px单位；这里要特别指出的是，1当你设置值的时候只提供一个值，则相当于只指定水平位置，垂直自动设置为50%；2当你设置的值是负数的时候，则表示背景图片超出边界。
　　例：body{background-image:url(file&:///C:/WINDOWS/BACKGRND.GIF);background-repeat:no-repeat;background-position:100px 10px}

二、css控制图片是否滚动 background-attachment

　　上面的两步可以帮你完成图像的定位，可是这样做好以后还不是完美的，因为如果你的页面有滚动条的时候，那么你这张背景图片就不会永远定位在那个位置了，如果想要图片永远定位在那个位置，就只有让这张图片随着页面的内容的滚动而滚动，这时background-attachment就可以帮你了你只要加入scroll（静止）和fixed（滚动）中的其中一个就可以了。当然不是让你乱加的，毕竟scroll是默认的，也就是不让图片随页面的内容而滚动的。
例：body{background-image:url(file&:///C:/WINDOWS/BACKGRND.GIF);background-repeat:no-repeat;background-attachment:fixed}

　　好了，经过以上这番设置后，我相信你的背景一定会更美的，但是过多的代码往往可读性很差，容易让人产生错误，所以在这里我要告诉大家的就是可以把以上的代码全部加在一起使用，也就是说把以上相关的代码加到background中。在把代码加到background中的时候要在每个值中间加上空格来隔开，而且不要把背景颜色的代码放在背景图片的URL后面，以免图片显示不出来。
例：body{background:green url(file&:///C:/WINDOWS/BACKGRND.GIF) fixed 100px 50px no-repeat}

　　最后提醒一下大家，如果用代码直接插入的话，那么一定要放下面这个代码的里后再放在之间才能正常显示出来！

　　接下来我再介绍一下用DW制作以上样式的方法，因为在DW中已经很详细的列出各项来了，具体的作用我也说明过了，所以就简要的介绍一下吧，只要大家能够明白就行了。 
　1.在此之前大家应该把CSS Styles这个窗口打开，如未打开的话，那么就按Shift+F11或者从Window下拉菜单中选择此项就可以了。
　2.点击右键选择new style...这个选项或者点击下面的带有+号的图标。
　3.在弹出的窗口中的选择如下，tag选择body因为我们上面介绍的CSS样式都是关于body的，而在这里我也只是介绍这个里面的background，其它的不要介绍内容之内；下面的type选择第二个；define也选择第二个，这样你呆会就可以在该文件中的之间找到一个了，而这里面的内容其实就是我上面介绍的。呵~_^
　4.点击OK后弹出的窗口才是最重要的。我之前已说过，我们这次主要介绍的是background这个选项，所以在旁边的窗口中选中它吧。选中以后右边的窗口将会变成与它相关的设置项，具体的我在上面介绍过了，大家只要参照上面的介绍就可以完成了。不过需要说明一下的是在这个窗口中的最下面两项其实就是background-position中的水平方向垂直方向。
　5.最后再点击OK就可以完成了。完成后你就可以在该页的代码（View下的Code选项）中找到它们了。