今天在做活动的时候，有这样的一个需求：头部的tab切换固定不动，底部还有一个浮层框也是固定不动的。
本来，我知道固定不动，那就是用position:fixed;来实现，但是，我中间的内容是一张图片，而且超过了手机屏幕大小，怎么滚也滚不到底部。
知道，我发现，设置一下图片的上下距离，就可以了。
```
<div class="header">这是固定不动的头部</div>
<div class="main"><img src="../"></div>
<div class="footer">这是底部要固定的浮层</div>
```
思路：
1、首先，header跟footer肯定都是要固定的，而且都是在页面的最上层，也就是离用户最近的地方。
表现为CSS就是：
```
position:fixed;
z-index:999;
```
2、设置main主题部分上下的距离,我用的是padding
```
padding-top:20px; //对应header的高度
padding-bottom:151px; //对应footer的高度
```
这样就可以了。
