前端切图的时候经常会遇到需要上下固定宽度，中间自适应的页面布局，下面是实现的代码。
工具/原料
html css
方法/步骤
1
首先我们打开html编辑器，新建3个盒子，高度都是200px,代码如下
2
然后我们通过定位固定头尾盒子,代码如下
3
显示的效果如下
4
然后中间盒子设置样式position: absolute;top: 200px;bottom: 200px;height: auto;代码如下，
5
最后显示效果如下
注意事项
1
中间盒子给个宽度宽度！不限效果出不来
2
这只是其中的一种方法，希望能帮助到大家，喜欢的话帮忙投个票