标签：info 简单 bsp height 需求 round yellow image 资料
从事前端工作近五年了，说来惭愧，对css一直很头疼，今天又碰到了一个让元素自动撑满高度的问题，以此来适应不同的屏幕尺寸，查阅了一些资料，发现解决方法竟然如此简单，我也来简单地记录一下吧。
需求描述：页面有一个公共的头部，下面是正文的div，为了适应不同尺寸的屏幕，要求让这个div自动撑满高度，底部不要有白屏缝隙。
下面是一个简单的小demo。
html部分:
<div class="main"> <div class="top"></div> <div class="bottom"></div> </div>
css部分：
* { margin: 0; padding: 0; } .main { width: 100%; height: 100%; } .top { height: 100px; background: pink; } .bottom { position: absolute; width: 100%; top: 100px; left: 0; bottom: 0; background: yellowgreen; }
简单的效果就实现了。
致谢：https://www.cnblogs.com/yoyogis/p/4040513.html
标签：info 简单 bsp height 需求 round yellow image 资料
原文地址：https://www.cnblogs.com/chenyn/p/12842880.html
