網站似乎不「中心」

-1

我正在學習HTML/CSS，目前正在嘗試使用我正在使用的書中的示例。「網站」中的內容應該居中，但是當我在瀏覽器中打開文件並查看Firefox時，內容看起來是正確的。下面是HTML和CSS（非常簡單）。我非常感謝任何幫助！網站似乎不「中心」

<!DOCTYPE html> 
<html> 
    <head> 
     <title>tayco</title> 
     <link href="css/styles.css" type="text/css" rel="stylesheet"/> 
    </head> 
    <body> 
     <div id="header"> 
       <h1>Logo</h1> 
      <div id="nav"> 
      <ul> 
       <li><a href="">Home</a></li> 
       <li><a href="">Products</a></li> 
       <li><a href="">Services</a></li> 
       <li><a href="">About</a></li> 
       <li><a href="">Contact</a></li> 
      </ul> 
     </div> 
    </div><!--end header--> 
    <div id="content"> 
     <div id="feature"> 
      <p>Feature</p> 
     </div> 
     <div class="article column1"> 
      <p>Column One</p> 
     </div> 
     <div class="article column2"> 
      <p>Column Two</p> 
     </div> 
     <div id class="article column3"> 
      <p>Column Three</p> 
     </div> 
    </div> 
    <div id="footer"> 
     <p>&copy: Copyright 2011</p> 
    </div> 
</body> 
</html> 





body { 
    width: 960px; 
    margin: 0 auto;} 
#content { 
    overflow: auto; 
    height: 100%;} 
#nav, #feature, #footer { 
    background-color: #efefef; 
    padding: 10px; 
    margin: 10px;} 
.column1, .column2, .column3 { 
    background-color: #efefef; 
    width: 300px; 
    float: left; 
    margin: 10px;} 
li { 
    display: inline; 
    padding: 5px;}

來源

2014-02-13 tayco

據中心對我很好。這是在jsfiddle中：http://jsfiddle.net/ng9UG/ – smdrager

把寬度和利潤率上#content不是身體

body { } 

#content { 
    width: 960px; 
    margin: 0 auto; 
}

來源

2014-02-13 04:43:38 roo2

使用text-align:center你的內容...

Jsfiddle：http://jsfiddle.net/fUy7b/1/

#content { 
    overflow: auto; 
    height: 100%; 
    text-align:center; /*here is the code*/ 
}

來源

2014-02-13 04:53:17 Krish

啊謝謝你！文本對齊是我正在尋找的！ – tayco

body{ 
    width: 960px; 
    margin: 0 auto; 
    text-align:center; 
     }

你想要什麼？..？如果你想要所有的東西都集中在logo，頁腳和所有內容中，可以在你的CSS中使用上面的代碼或者使用@Nikhil krishnan的代碼。

來源

2014-02-13 05:17:53 shubhraj

在屏幕的中心對齊的內容，請在您的樣式表下面的CSS規則（類）：

<style> 
    #nav, #feature, #footer, #content 
    { 
     text-align: center; 
    } 
</style>

來源

2014-02-13 05:20:26

謝謝！那就是我一直在尋找的！ – tayco

網站似乎不「中心」

回答

相關問題