0

为了简短起见，这是问题的示例。

http://jsfiddle.net/2KTFG/1101/

看到第一段消失在标题后面

html

<div id='header'>
    <div id="div_1">
        <p>hello</p>
    </div>
    <div id= "div_2">
        <p>hello</p>
    </div>
</div>
<div id='body'><p>why this goes behing previous div?</p>
    <p>why this goes behing previous div?</p>
    <p>why this goes behing previous div?</p>
</div>

CSS：

#header {
    position: fixed;
    top: 0px;
    height: 50px;
    width: 100%;
    background: green;
}
#div_1 {
       margin: 0 auto;
}

#div_2 {
    margin: 0 auto;
}
#body{ margin-top: 30px; height: 3000px; overflow: auto; }

提前致谢

4

3 回答 3

0

给东西的位置：固定的；将导致该元素固定到您将其放置在浏览器中的任何位置。由于您的段落 div 没有任何位置样式，因此标题将放置在其顶部。

如果你给每个元素位置：relative; 它们将堆叠在一起。

#header {
    position: relative;
    top: 0px;
    height: 50px;
    width: 100%;
    background: green;}
#body{ height: 3000px; overflow: auto;position:relative; }

小提琴中的例子。

于 2013-11-08T23:32:04.153 回答
0

因为您将正文的边距设置为 30，将标题的高度设置为 50px。

于 2013-11-08T22:37:37.667 回答
0

因为这#body (margin-top:30px)不足以清除标题。增加边距值以将第一段向下推。

我希望这有帮助

于 2013-11-08T22:37:41.620 回答