html - 在纯 HTML/CSS 中使用静态高度的页眉和页脚拉伸(stretch)垂直布局

Question

构建页眉和页脚具有静态高度且中心占据所有可用空间(并调整为窗口高度)的垂直布局的最简单方法是什么。

header
------

center


------
footer

感谢帮助

ps 绝对定位不是我的选择。

Answer 1

我相信这就是你要找的
jsFiddle

使用边距设置 margin-top和 margin-bottom中间的<div>至 -50px ，或者您想要的页眉和页脚各自的高度。

如果您想将内容添加到页面的中间部分，也可以使用这种(相对笨拙的)方法。 jsFiddle