[导读] 加上页头页脚和内容部分，为了让 footer 在最下方，我们当然要把 footer“请出”wrapper 之外。当然，这样高度就超过一屏了，别急，后面有解决办法。..

兰州网站建设制作页脚如何自适应布局？
    1、为了让 footer 能够刚好在最下方，网站制作时可以给footer加一个等于自身高度的上方的负边距强制把它向上推一个自身的高度，即 margin-top: -50px; 。但是这样的话当内容超过一屏我们会看到内容会盖在 footer 的上方，显然这是失败的。所以我们还要给 content-box 和 sidebar 加一个父级元素，设定它的下方内补丁等于 footer 的高度，强制把 content-box 和 sidebar 向上推一个 footer 的高度。同时，因为 content-box 和 sidebar 是浮动元素，所以我们还要让它 闭合浮动元素 。
　　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%; } 这样，一个最简单的最小高度满一屏的自适应布局就做好了。