1. 程式人生 > >CSS + DIV 讓頁尾始終位於底部

CSS + DIV 讓頁尾始終位於底部


<body>  
<form> <!-- 如果用的是 Asp.Net 就可能會有這個結點 -->  
  <div class="Wrapper">  
    <div class="Header"></div>  
    <div class="Content"></div>  
    <div class="FooterPush"></div>  
  </div>  
  <div class="Footer"></div>  
</form>  
</body>  
*  
{  
  margin: 0;  
  padding: 0;  
}  
     
html, body, form  
{  
  height: 100%;  
}  
     
.Wrapper  
{  
  min-height: 100%;  
}  
     
  .Wrapper .FooterPush  
  {  
    height: 120px; /* Footer 的高度 */  
  }  
     
.Footer  
{  
  clear: both; /* 清除浮動元素格式 */  
  position: relative;  
  margin-top: -120px; /* Footer 高度的負值 */  
  height: 120px;  
}