小编典典

CSS使HTML页面页脚以最小高度留在页面底部,但不与页面重叠

all

我有以下页面(死链接:)http://www.workingstorage.com/Sample.htm,它有一个页脚,我不能让它坐在页面底部。

我希望页脚

  • 当页面较短且屏幕未填满时,贴在窗口底部,并且
  • 当内容超过一屏时(而不是重叠内容),停留在文档末尾并正常向下移动。

CSS是继承的,让我感到困惑。我似乎无法正确更改它以在内容上设置最小高度或使页脚进入底部。


阅读 101

收藏
2022-03-11

共1个答案

小编典典

一个简单的方法是制作100%你的页面的body,用min-heightof100%也可以。如果页脚的高度没有改变,这可以正常工作。

给页脚一个负边距顶部:

footer {
    clear: both;
    position: relative;
    height: 200px;
    margin-top: -200px;
}
2022-03-11