Question

任何人都可以帮我制作基于DIV的HTML代码，其结果与此基于TABLE的代码类似：

<HTML>
<BODY>

<STYLE>
html,body {height:100%;}
</STYLE>

<TABLE cellpadding=0 cellspacing=0 height=100% width=100%>
<TR>
  <TD bgcolor=pink>
    Page content...<BR>111<BR>222<BR>333
  </TD>
</TR>
<TR>
  <TD bgcolor=yellow id=footer style="height:1%">
    Footer...<BR>111<BR>222<BR>333<BR>
    <BUTTON onclick="document.getElementById('footer').innerHTML+='<BR>more footer...';">Increase footer</BUTTON>
  </TD>
</TR>
</TABLE>

</BODY>
</HTML>

Answer 1

将此作为CSS添加到页脚..

#footer{
   position:fixed;
   left:0px;
   bottom:0px;
   height:30px;
   width:100%;
   background-color : //whichever color you want
}

Answer 2

您需要指定中心div /元素的最小高度。

例如，以下HTML代码段可确保页脚始终至少距离浏览器顶部600px

<html>
<head>
</head>
<body>

<div style="min-height: 600px;" id="center-content">

</div>

<div id="footer">

</div>
</body>
</html>

页脚始终位于底部但没有固定高度

2 个答案: