1

作成しているテストページで、この奇妙な間隔がページの上部に表示されていますが、これがなぜであるかわかりません。

以下のCSSからわかるように、bodyタグのマージンとパディングは0に設定されています。

間隔の意味を確認するためのテストサイトのURLは次のとおりです。http://s361608839.websitehome.co.uk/testsite/index.html

CSS:

body{
background: #4f6ca6;
margin: 0;
padding: 0;
}

#header{
background:url(../images/header_bg.jpg) no-repeat center top;
height: 328px;
width: 100%;
border-bottom: 1px solid #223c6d;
-webkit-box-shadow: 0 8px 6px -6px #254379;
-moz-box-shadow: 0 8px 6px -6px #254379;
box-shadow: 0 8px 6px -6px #254379;       
}

#slider{
width: 960px;
height: 328px;
margin: 0 auto;
}

HTML:

 <div id="header">
 <div id="slider">
 <h1>Test Site</h1>
 <h2>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</h2>
 </div>
 </div>
4

3 に答える 3

3

それがあなたのh1要素のトップマージンです。

于 2012-04-25T23:10:20.550 に答える
3

あなたの<h1>タグに30pxは余裕があります。

これはインスペクターと呼ばれます。

ここに画像の説明を入力してください

それを学び、それを愛し、そしてそれを乱用します。

于 2012-04-25T23:13:20.713 に答える
1

ほとんどの要素の初期リセットを検討する必要があります。これは、最初はより多くの作業を意味しますが、はるかに優れた制御を提供し、トラブルシューティングを大幅に簡素化します。

Meyerのリセットは、非常に一般的な開始点です。

于 2012-04-25T23:14:08.880 に答える