html - 低于全高 div 的 div

Question

我正在制作一个单页网站，所以它是一个长页面。但我想制作第一个 div，它是页面的全高和全宽，并且有一个 logo 居中。然后我想在它下面放置固定高度的div。

所以当页面打开时，logo总是居中的，下面的div还不可见（因为第一个占满高度）。当他们开始滚动时，下一个 div 就在它的正下方并显示出来。

这甚至可能吗？我试图寻找这个，但什么也没找到。

谢谢马克斯

Answer 1

给你：http: //jsfiddle.net/BramVanroy/NMeAQ/

html, body {
  width: 100%;
  height: 100%;
}

#logo {
  width: 100%;
  height: 100%;
  background: #ccc;
}

#logo > img {
  border: 10px white solid;
  left: 50%;
  margin-left: -130px; /* the width of your image divided by 2 */
  top: 50%;
  margin-top: -130px; /* the height of your image divided by 2 */
  position: absolute;
}