我已经远离标记网站一段时间了。所以现在我们在CSS中有HTML5和很多新功能。我有一个常见的网站布局与固定大小的页眉和页脚。当然主要内容区域之间。默认情况下，页面应该占据窗口高度的100％(即内容区域扩展)。如果内容是长页面，垂直滚动条出现，并且都像通常一样。
通常我曾经这样做：
通常我曾经这样做：
<body>
<table id="main" ...>
<tr>
<td id="header-and-content">
<div id="header">contains logo,nav and has fixed height</div>
<div id="content">actual content</div>
</td>
</tr>
<tr>
<td id="footer">
fixed size footer
</td>
</tr>
</table>
</body>
并附带css：
html,body { height:100% }
table#main { height:100% }
td#footer { height:123px }
所以，它已经过时了。你跟随新的标记技术，现在在2011年如何完成？
UPD人，不会发生语义标记或使用div。我知道这是什么意思现在问题 – 即使内容是空的还是短的，我如何告诉页脚保持底部。当内容足够长时，脚跟就像在其他情况下一样。绝对和固定不是解决方案(至少在其基本形式)
一些概要更新
>我尝试过使用display：table和display：table-row的方法，它的作用是：little content，more content
>方法Make the Footer Stick to the Bottom of a Page由Andrej提醒。它也工作：little content，more content
有些失望，虽然我觉得：第一种方法只是那些表，但没有表标记。第二个是老的，我避免使用它，因为它类似于黑客。我的上帝，没有什么新的:)
解决方法
那么，首先在2011年，我们不再使用表格进行布局了！
如果我是你，我会写这样的标记：
<body>
<div id="main" role="main">
<header>
contains logo,nav and has fixed height
</header>
<div class="content"> /*use <article> or <section> if it is appropriate - if not sure what to use,use a div*/
actual content
</div>
<footer>
fixed size footer
</footer>
</div>
</body>
除了更改的选择器，CSS将是一样的
html,body { height:100% }
#main { height:100% }
footer { height:123px }
对于固定的页脚，我建议使用位置：绝对或可能的位置：固定 – 这取决于您希望它的行为(滚动页面或始终保持在底部)。
要制作一个“粘性”页脚，那将在页面的底部，但随着内容的移动，this method将会做到这一点。