标签：
总结：
1.利用样式height:100%设置div高度为全屏时候必须设置所有的父元素，但是父元素那么多，不可控，所以此法不可行；
2.设置父框架的padding为100px，div进行float，padding有效；但div进行position，并配合left：0，padding失效；
3.弹性盒子模型需要position属性和两个相对立的属性，比如top和bottom，left和right。
4.要做出来自适应的三个模块，要会计算中间div进行position后left和right的值，此值与左右两边的div宽度有关
测试的代码如下：
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <style type="text/css"> *{ padding: 0; margin: 0; } /*html,body{ height: 100%; }*/ .elasticityBox{ border: 1px #000 solid; padding: 100px; } .elasticityBox .box01{ position: absolute; border: 1px red solid; top:0; bottom: 0; left: 200px; right: 200px; } /*.elasticityBox .box01{ border: 1px red solid; float: left; }*/ .elasticityBox .box02{ border: 1px yellowgreen solid; width: 100px; position: absolute; left: 0; top:0; bottom: 0; } .elasticityBox .box03{ border: 1px yellowgreen solid; width: 100px; position: absolute; right: 0; top:0; bottom: 0; } </style> </head> <body> <div class="elasticityBox"> <div class="box01">123</div> <div class="box02">3456</div> <div class="box03">789</div> </div> </body> </html>
标签：
原文地址：http://www.cnblogs.com/lily1010/p/5405906.html
