0

我刚接触 CSS：

我的问题是我的徽标出现了，但它在后面，我应该把我的 div:top-most 放入包装器中吗？因为如果我把我的 div:top-most 放在上面，它会和 logo 一起显示，但我希望我的石灰颜色放在浏览器的最大宽度上。

这是我的 HTML 代码

<body>
<div id="top-most">
</div>

<div id="wrapper">
<img alt="logo" src="images/logo.png" /><div id="wrapper">      
</div>


<div id="header">
    <p>Put something here</p>
</div>
</body>

这是我的 CSS 代码：

#top-most           { background-color: lime; height:51px ;width:100%; position:absolute; }

#wrapper            {  width :960px; height:100px ; overflow:hidden; margin:0px auto; }

#logo               { margin: 19px 0 0 10px; position:absolute; top: 0px; z-index:2; }

#header             { margin: 30px  0 0 20px; float:right; width: 750px;   }
#header p           { color: #979899; }

这是输出：http: //imgur.com/gWDNYGB

4

1 回答 1

0

你好:) 你需要把#wrapper 放在#top-most 中。

<body>
<div id="top-most">
<div id="wrapper">
<img alt="logo" src="http://placekitten.com/200/300" />   
</div>
</div>
<div id="header">
<p>Put something here</p>
</div>
</body>

我也编辑了你的 CSS 代码。

#top-most           { background-color: lime; padding: 5px; position:absolute; }
#wrapper            {  width :960px; height:100px ; overflow:hidden; margin:0px auto; }
#logo               { margin: 19px 0 0 10px; position:absolute; top: 0px; z-index:2; }
#header             { margin: 30px  0 0 20px; float:right; width: 750px;   }
#header p           { color: #979899; }

你不需要填充：5px; 在 #top-most 但它看起来会更好 Demo

于 2013-09-10T05:24:18.530 回答