1

我想使用一个固定的标题，后面有内容。菜单将包含锚链接，因此所有内容都将在一页中。

但是，我被卡在了早期阶段。我认为这不会有问题，但似乎div 以某种方式header捕捉到了div。content看起来他们有相同的利润。

如果position:fixed;被删除，它看起来应该，但我希望它被修复。

我真的不明白为什么会发生这种情况，因为它们彼此分开。使用类似的东西margin-top:-100px感觉不对。

这样做应该没有丑陋的解决方案......

CSS：

#header {
position:fixed;
width:1200px;
border:1px solid black;
z-index:1;
overflow:hidden;
background-color:white;
}

#menu {
width:100%;
z-index:2;
}

#content {
margin: 100px 0 0 0;
background-color:red;
overflow:hidden;
width:1200px;
z-index: -1;
height:100%;
}

HTML

<div id="header">
 <h1>Header</h1>
  <div id="menu"><ul>
   <li><a href="#works">Works</a></li>
   <li><a href="#news">News</a></li>
   <li><a href="#about">About</a></li>
   <li><a href="#contact">Contact</a></li>
 </ul>
 </div>
 </div>

<div id="content">
  <div id="works" name="works"></div>
  <div id="news" name="news"></div>
  <div id="about" name="about"></div>
  <div id="contact" name="contact"></div>
</div>  

<div id="footer"></div>
4

1 回答 1

1

添加top: 0px;到您的#header班级

于 2013-03-14T09:30:28.380 回答