我正在制作一个网页布局,希望它在所有屏幕上都具有相同的外观。我正在处理的页面包含三个部分,页眉、主体和页脚,我希望页眉位于屏幕顶部。 main 和 footer 粘在页面底部。
这是我想做的:
- 我将页眉置于顶部,但我无法将百分比添加到主要部分和页 footer 分。
在页眉中还有一个名为“div5”的 div,我希望它粘在作为主框或中间框的父 div 的底部。
在页脚中我有三个框,它们分别位于左侧、右侧和中间。
你能看看linked site吗?并让我知道如何解决这些问题。
最佳答案
百分比高度仅在您将父元素设置为具有高度时才有效。
(元素会询问“什么的百分比?”)
这里我们给body设置了一个高度
CSS
<style type="text/css">
html,body { height:100%;}
#header { display:block; height:10%; }
#main { display:block; height:80%; }
#footer { display:block; height:10%; }
</style>
标记
<body>
<div id="header"></div>
<div id="main"></div>
<div id="footer"></div>
</body>
关于html - 适合所有屏幕的百分比定位,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10769246/