HTML/CSS正文不在頁面的頂部

我對HTMl/CSS有問題。它似乎像我的身體標記不知何故得到了10px的邊緣... ...但我無法找到擺脫它。我建立的其他網站從未這樣做，所以任何幫助，將不勝感激。HTML/CSS正文不在頁面的頂部

的代碼：

HTML

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="js_plugins/skrollr.js"></script> 
     <link rel="stylesheet" type="text/css" href="theme.css"> 
     <link rel="stylesheet" type="text/css" href="text.css"> 
     <title>MyPage</title> 
     <meta charset="UTF-8"> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    </head> 
    <body> 
     <div id="maincontent"> 
      <section id="maincontent-sect-intro" > 
       <div id="maincontent-sect-intro-content"> 
        <p class="name-intro">Introduction</p> 
       </div> 
      </section> 
     </div> 
    </body> 
</html>

CSS

body 
{ 
    width: 100%; 
    margin: 0px; 
} 
div#maincontent 
{ 
    min-width: 1000px; 
    width: 100%; 
} 
section 
{ 
    margin-top: 0px; 
    height: 550px; 
    width: 100%; 
} 
/* 
For intro section 
*/ 
section#maincontent-sect-intro 
{ 
    background-color: #666666; 
    text-align: center; 
} 
div#maincontent-sect-intro-content 
{ 
    text-align: center; 
}

來源

2014-09-27 Dan

你試過'html {padding：0; }'？ – Paul 2014-09-27 15:49:27

在你的CSS中添加'.name-intro {margin：0;}' - http://jsfiddle.net/czc84qd6/ – Anonymous 2014-09-27 15:50:05

@Paul padding在這裏不是問題，邊距值是，但是OP已經在body中設置了並應該有沒有空白處...... – 2014-09-27 15:51:10

這裏你的問題是p類「name-intro」<p>標籤自動給出1em的保證金。只需添加到您的CSS

.name-intro { 
    margin: 0; 
}

也是一個經驗法則，指定0值時，絕不添加像素或他們，只是把它作爲零:)

來源

2014-09-27 15:55:28 Blake

這是正確的解決方案。標題可能導致類似的問題。另一種解決方案是將「overflow：auto」添加到導致邊緣問題的子元素的父元素。 – John 2014-09-27 15:59:59

-1

您可能需要的CSS改變爲：

body, html { 
    width: 100%; 
    margin: 0; 
}

來源

2014-09-27 15:51:23 sundanlotion

您需要設置填充和利潤率兩者。

padding:0 
margin: 0

來源

2014-09-27 15:55:52 Vis

HTML/CSS正文不在頁面的頂部

回答

相關問題