上下两个元素高度固定，中间内容自适应

头尾固定高度中间高度自适应布局

头部固定高度，宽度100%自适应

底部固定高度，宽度100%自适应

中间是主体部分，自动填满，浏览器可视区域剩余部分，内容超出则中间部分出现流动条；

整个内容填满浏览器可视区域，并且不超出此区域！

<div id="dHead">固定头部100px;</div>
    <div id="dBody">
        <div class="mycontent">
            中间自适应部分
        </div>
    </div>
<div id="dFoot">固定尾部100px</div>

<style>
        #dHead {
            height:100px;
            background:#690;
            width:100%;
            position:absolute;
            z-index:5;
            top:0;
        }
        #dBody {
            background:#FC0;
            width:100%;
            overflow:auto;
            position:absolute;
            z-index:10;
            top:100px;
            bottom:100px;
        }
        #dFoot {
            height:100px;
            background:#690;
            width:100%;
            position:absolute;
            z-index:200;
            bottom:0;
        }
    </style>

平常代码中我不推荐使用position: fixed;去定位，因为他是相对于外层，写安卓的应该知道fixed;的弊端
这里使用position:absolute;也可以实现我们想要的功能