例如
<div id="parent1" style="height:100%;width:100%">
<div id="son1" style="height:150px;width:100%">
</div>
<div id="son2" style="">
</div>
</div>
son2的style该如何设置,高度为parent1-son1的高度
<div id="parent1" style="height:100%;width:100%">
<div id="son1" style="height:150px;width:100%">
</div>
<div id="son2" style="height:auto;min-height:150px;width:100%">
</div>
</div>
<div id="son1" style="height:150px;width:100%">
</div>
<div id="son2" style="height:auto;min-height:150px;width:100%">
</div>
</div>
你要做自适应,当然用AUTO,,当然,你又想内容太少的时候,指定它一个高度,就可以用min-height这个是最小高度的意思,意思就是,如果容器没有达到这个高度就按这个高度,超过这个高度,就按height。。。。还有MAX-HEIGHT,这是最大高度,限制高度的作用。。。
温馨提示:答案为网友推荐,仅供参考
第1个回答 2014-01-08
你这边父级div的高度是100%,son1的高度是150,son2的高度也定位150不久可以了吗,运行一下这段代码看看是不是你要的效果
<div id="parent1" style="height:100%; width:100%; background:#039; border:1px solid #ccc;">
<div id="son1" style="height:150px;width:100%; background:#039;">
</div>
<div id="son2" style="background:#06F; height:150px;">
</div>
</div>
<div id="parent1" style="height:100%; width:100%; background:#039; border:1px solid #ccc;">
<div id="son1" style="height:150px;width:100%; background:#039;">
</div>
<div id="son2" style="background:#06F; height:150px;">
</div>
</div>
第2个回答 2014-01-08
mx-height:150px;
第3个回答 推荐于2016-10-08
<div id="parent1" style="background:#ccc;height:100%;width:100%;overflow:hidden">
<div id="son1" style="background:#d5d5d5;height:150px;width:90%;margin:0 auto;">
</div>
<div id="son2" style="height:auto;width:90%;margin:0 auto;overflow:hidden">内容
</div>
</div>
--------------------------上面的背景色和margin值仅为了测试用,可以去掉-------------------------本回答被提问者和网友采纳
<div id="son1" style="background:#d5d5d5;height:150px;width:90%;margin:0 auto;">
</div>
<div id="son2" style="height:auto;width:90%;margin:0 auto;overflow:hidden">内容
</div>
</div>
--------------------------上面的背景色和margin值仅为了测试用,可以去掉-------------------------本回答被提问者和网友采纳