2、加上页头页脚和内容部分，为了让 footer 在最下方，我们当然要把 footer“请出”wrapper 之外。当然，这样高度就超过一屏了，别急，后面有解决办法。
#header { background: Green; height: 40px; } #sidebar { float: left; width: 200px; background: Gray; } #content-box { float: right; width: 570px; background: Olive; } #footer { height: 50px; background: Background; width:770px; margin: auto; }
3、为了让浏览器识别高度100%在网站制作时需要先给html和body加上一个高度值，同时清除所有元素的margin和padding。顺便提一下，经过我的测试，html 和 body 的 height: 100%; 等于整个浏览器窗口的总高度，无论内容是否超过一屏。而它们下一级子元素 height: 100%; 则等于第一屏的高度。如何，是不是有点不好理解？
* { margin: 0; padding: 0; } html, body { height: 100%; }2、因为上面提到的问题，所以为了让布局自适应高度，我们要加上 min-height: 100%;，虽然IE不支持这个属性但是IE的 height: 100%; 有同样的作用：
#wrapper { min-height: 100%; } * html #wrapper { height: 100%; } 这样，一个最简单的最小高度满一屏的自适应布局就做好了。
