3

您好,我正在构建一个移动网页,其中我的内容只会滚动,而我的页脚和页眉是位置:固定 - 我可以制作内容,使其不会在页眉或页脚下滚动,以便它只滚动它自己分区。

我想这样做的原因是我的页眉和页脚会有一些不透明度,如果内容滚动到下面,它看起来不太好。

这是我制作的一个jsfiddle,只是为了向您展示滚动的示例

http://jsfiddle.net/VNVqs/

4

1 回答 1

6

给你:

http://jsfiddle.net/VNVqs/3/

我刚刚删除了position: absolute滚动部分(包装器滚动内容),并padding在包装​​器中添加了一些,以便让第一个和最后一个项目不在页眉和页脚下。

基本上,这个技巧是通过position: fixed 只使用 header 和 footer来完成的,让页面的其余部分像普通页面一样滚动,而不使用overflow: auto特定的固定高度元素。这样做,唯一的问题是内容的第一行将始终位于固定位置的标题下(最后一行位于页脚下),但您可以通过在内容包装器上应用一些填充来解决此问题,最多页眉(和页脚)高度。你说对了?

于 2012-06-05T07:41:43.293 回答