实现上下固定中间自适应布局

1.通过position:absolute实现
定义如下结构
<body>
<div class="container">
<div class="top"></div>
<div class="center"></div>
<div class="bottom"></div>
</div>
</body>
style实现如下:
<style>
			body,
			html {
				width: 100%;
				height: 100%;
				background-color: yellow;
				margin: 0;
				padding: 0;
			}
			.container {
				height: 100%;
			}
			.top,
			.bottom {
				width: 100%;
				height: 100px;
				background-color: red;
			}
			.bottom {
				background-color: green;
			}
			.center {
				position: absolute;
				width: 100%;
				/* height: 100%; */
				/* margin-bottom: 100px; */
				top: 100px;
				bottom: 10
                


















