1

我是这个网站的新手,所以很抱歉,如果我踩到脚趾,但我一直在尝试创建一个页面,在该页面上你会遇到一个全屏标题,高度和宽度为视口的 100%,但是你仍然能够滚动到下面的内容。

完美的例子是http://www.bklynsoap.com/

我试图通过在绝对定位的 Div 上创建 100% 的高度和宽度来使用纯 CSS 来实现这一点,但这隐藏了下面的内容。

4

1 回答 1

1

在此不需要绝对位置。您的示例使用 javascript 来更改 div 的大小和里面的内容。

你可以用纯 CSS 做到这一点

例子:

<html>
   <body>
     <section class="fullscreen"></section>
     <section class="other-content></section>
   </body>
</html>



html {
 height: 100%;
}

body {
 height: 100%;
}

.fullscrenn {
  height: 100%;
  width: 100%;
  background: url('../images/fullscreen.jpg') no-repeat center center; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
   background-size: cover;
}
于 2013-10-20T20:19:35.567 回答