2011-03-28 71 views
-1

誰能幫助我,使基於DIV的具有simular結果作爲該表基於代碼的HTML代碼:頁腳總是在底部,但沒有固定的高度

<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> 
+0

頂部600px的,你可以投票向上或接受的答案,如果它幫助你! – 2011-03-28 11:35:28

回答

0

爲CSS添加到您的頁腳..

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

但你的CSS類的源代碼在哪裏? – 2011-03-28 09:09:04

+0

使用內聯CSS – 2011-03-28 09:26:23

+0

Tarun,我已經測試過你的代碼,但它不能按我的預期工作。我希望頁腳始終處於底部,但在您的情況下,當內容div的高度較小時,它不在底部。 – 2011-04-07 11:18:21

0

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

例如下面的HTML片段將確保頁腳總是至少從瀏覽器

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

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

</div> 

<div id="footer"> 

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