身体背景和身高

问题描述:

当我尝试在身体元素上设置背景图像并且页面比视口更高时,您可以向上或向下滚动。然后背景图像开始/结束于当scrollTop为0时视口结束..身体背景和身高

它的身体高度100%是否等于视口高度?为什么?我究竟做错了什么?

html { 
    height:100%; 
} 

body { 
    font-family:tahoma; 
    font-size:11px; 
    color:#333333; 
    background:url('/new/gfx/layout.bottom_bg.png') bottom repeat-x #eef7ff; 
    margin:0px; 
    height:100%; 
    overflow-y:scroll; 
} 

你没有做错任何事;身高100%确实表示视口的高度。如果您希望它是图像的高度,则应使用图像的像素高度。如果您希望它扩大到内容的大小,则可以使用min-height属性(设置为100%)。

+0

但你能做些什么来解决它,并使'底部'工作在后台属性? – clarkk

+0

你很可能会想使用'min-height',以便在需要时拉伸它,但至少占用整个视口。当它伸展并且您滚动时,您应该在底部看到它。 另一方面,如果您希望它固定在视口的底部,而不管滚动内容,则可以使用'background-attachment:fixed'。 –

height:100% IS等于视口高度。要么不指定高度或使用min-height: 100%;