Html 如何在内容页中100%固定高度？CSS和Div

如何在内容页中100%固定高度？CSS和Div

Header=72px
Content Height=100%
footer=72px

我想修正支出内容高度100%全屏。

---

最好的问候

如果您的内容在一个div中，请按如下所示给它一个高度

<div id="container">
<div id="header">
</div>
<div id="content">
</div>
<div id="footer">
</div>
</div>

div#container
{
height: 100%;
}

div#header
{
height: 72px;
}

div#content
{
height: 100%;
}

div#footer
{
height: 72px;
}

分区#集装箱
{
身高：100%；
}
div#头
{
高度：72px；
}
分区内容
{
身高：100%；
}
div#页脚
{
高度：72px；
}

如果我理解正确，我认为您希望页眉和页脚的高度都达到72像素，并且内容占据剩余空间的100%。因此页脚被推到页面底部

标记，将此容器放置为body的唯一直接子容器。换句话说，将所有内容放在#页眉、#正文和#页脚内

---

这对你有帮助吗？如果是，请点击勾号接受答案。

<div id="container">
   <div id="header"></div>
   <div id="body"></div>
   <div id="footer"></div>
</div>

html,
body {
   margin:0;
   padding:0;
   height:100%;
}
#container {
   min-height:100%;
   position:relative;
}
#header {
   padding:10px;
   height:72px;
}
#body {
   padding:10px;
   padding-bottom:72px;   /* Height of the footer */
}
#footer {
   position:absolute;
   bottom:0;
   width:100%;
   height:72px;   /* Height of the footer */
}