CSS使HTML页面页脚以最小高度留在页面底部,但不与页面重叠 [英] CSS to make HTML page footer stay at bottom of the page with a minimum height, but not overlap the page
本文介绍了CSS使HTML页面页脚以最小高度留在页面底部,但不与页面重叠的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有以下页面(死链接:http://www.workingstorage.com/Sample.htm
)有一个页脚,我无法将其放在页面底部.
I have the following page (deadlink: http://www.workingstorage.com/Sample.htm
) that has a footer which I can't make sit at the bottom of the page.
我希望页脚
- 当页面较短且屏幕未填满时,贴在窗口底部,并且
- 当内容超过一屏时(而不是重叠内容),停留在文档末尾并正常向下移动.
CSS 是继承的,让我很困惑.我似乎无法正确更改它以在内容上设置最小高度或使页脚移至底部.
The CSS is inherited and befuddles me. I can't seem to change it properly to put a minimum height on the content or make the footer go to the bottom.
推荐答案
一个简单的方法是让你的页面的body 100%
,加上一个min-height
100%
.如果您的页脚高度没有改变,这很好用.
A simple method is to make the body 100%
of your page, with a min-height
of 100%
too. This works fine if the height of your footer does not change.
给页脚一个负边距:
footer {
clear: both;
position: relative;
height: 200px;
margin-top: -200px;
}
这篇关于CSS使HTML页面页脚以最小高度留在页面底部,但不与页面重叠的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文