这个问题发生的原因是根据规范，一个盒子如果没有上补白(padding-top)和上边框(border-top)，那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠。
通俗点说：
父元素的第一个子元素的上边距margin-top如果碰不到有效的border或者padding.就会不断一层一层的找自己父元素，祖先元素进行垂直外边距合并。只要给父元素（或祖先元素）设置个有效的 border或者padding就可以有效的管制子元素的margin防止它越级。
解决方法：
给父元素加个padding或border或overflow:hidden
background:url(images/loginbackground.png)top no-repeat 0px 10px
等同与
background:url(images/loginbackground.png)top no-repeat
background-position: 0px 10px//水平方向(以左上角为原点，x方向)移动 0像素，垂直方向（y轴方向）即向下以动 10 像素
***注意：0px 不能省略，否则默认为x方向移动的距离。也可以设置为百分比值。
修改后：
背景图片位置在CSS中有专门的属性来调整：background-position:x yx的意思是x轴的数值、百分比，位置。
y的意思是y轴的数值、百分比，位置。
你可以在你的CSS图片属性里加上background-position:10px 50px
