頁眉和頁腳之間的垂直中心內容

Question

我想知道是否有人能幫助我。我有一個頁眉，頁腳和內容容器的網站。現在我希望在頁眉和頁腳容器之間垂直居中放置內容，而不是頁面。有沒有人有任何想法如何實現這？

Answer 1

嘗試下面的CSS

 <div >header</div> 
     <div class="container"> 
       <p>This small paragraph...</p> 
     </div> 
     <div >footer</div> 

CSS：

  div.container { 
       min-height: 10em; 
       display: table-cell; 
       vertical-align: middle ;} 

Answer 2

嘗試下面的CSS

 <div class="wrapper"> 
      <div >header</div> 
      <div class="container"> 
       <p>This small paragraph...</p> 
      </div> 
      <div >footer</div> 
     </div> 

CSS：

 .wrapper{ display: table; } 

     div.container { 
      min-height: 10em; 
      display: table-cell; 
      vertical-align: middle ; 
     } 

試試這個我只是添加了包裝與顯示：表格樣式。

表格單元屬性只能用包裝顯示：表屬性