上、中、下三行排列，DIV怎么设置
日期：2014-05-17 浏览次数：20734 次
上、中、下三行排列，DIV如何设置？
要求如下：
1.上：宽100%，高25px
中：宽100%，高随页面高度而变化
下：宽100%，高50px
2.最大化时不能出现滚动条，只有在页面高度小于“上行高+下行高+中行最小高度”后才出现滚动条
3.感谢各位光临
------解决方案--------------------
中行最小高度是什么?
------解决方案--------------------
上下用绝对值,中间用百分比
<html>
<body style= "margin:0px ">
<div style= "background-color:#996666;height:15px ">
123123123123
</div>
<div style= "background-color:#669966;height:85% ">
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
</div>
<div style= "background-color:#666699;height:50px ">
123123123123
</div>
</body>
</html>
------解决方案--------------------
首先获得当前页面的总高度，然后减掉上下的高度，剩下的就是中间的高
------解决方案--------------------
设置百分比就是为了应对变化的~~~窗口大小变了body的大小就变了~~你的div是在body的第一层,设置100%实际就是整个body的大小,body变了你的div也就变了~~~
------解决方案--------------------
中间那层假如是窗体的80%,那么窗体变小了中间那层会自动变小,小到最小高度~~~
这不正是你想要的吗?
百分比不是固定值啊!
------解决方案--------------------
在footer的style里面加上
clear:both
试试看。
------解决方案--------------------
楼上OK。 CLEAR：TOP；也可以。
要求如下：
1.上：宽100%，高25px
中：宽100%，高随页面高度而变化
下：宽100%，高50px
2.最大化时不能出现滚动条，只有在页面高度小于“上行高+下行高+中行最小高度”后才出现滚动条
3.感谢各位光临
------解决方案--------------------
中行最小高度是什么?
------解决方案--------------------
上下用绝对值,中间用百分比
<html>
<body style= "margin:0px ">
<div style= "background-color:#996666;height:15px ">
123123123123
</div>
<div style= "background-color:#669966;height:85% ">
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
123123123123 <br />
</div>
<div style= "background-color:#666699;height:50px ">
123123123123
</div>
</body>
</html>
------解决方案--------------------
首先获得当前页面的总高度，然后减掉上下的高度，剩下的就是中间的高
------解决方案--------------------
设置百分比就是为了应对变化的~~~窗口大小变了body的大小就变了~~你的div是在body的第一层,设置100%实际就是整个body的大小,body变了你的div也就变了~~~
------解决方案--------------------
中间那层假如是窗体的80%,那么窗体变小了中间那层会自动变小,小到最小高度~~~
这不正是你想要的吗?
百分比不是固定值啊!
------解决方案--------------------
在footer的style里面加上
clear:both
试试看。
------解决方案--------------------
楼上OK。 CLEAR：TOP；也可以。
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
