Question

我无法让背景与用户一起滚动。我希望12％的顶部为白色，6％的底部为白色，其余部分为蓝色。我希望顶部的白色仅在用户位于页面顶部时显示，而当用户位于页面底部时显示底部的白色。

Here's an image of the page, zoom in to fit your screen then scroll so you get the idea of what I'm going for.

任何帮助都将不胜感激。

    <body>
<div id="bg-top"></div>
</body>
<style>

body {
  background-color: #ffffff;
  position: scrolling;
}
#bg-top {
  background-color: #00b9ff;
  position: scrolling;
  top: 12%;
  position: fixed;
  bottom: 6%;
  left: 0%;
  right: 0%;
  z-index: -1;
}


</style>

Answer 1

你需要使用位置绝对而不是固定，如下所示：

我对身体的高度给予了很大的评价，以便更好地看到结果

＆＃13;

body {
  margin:0;
  padding:0;
  background-color: #ffffff;
  position: relative;
  min-height:1000px;
}

#bg-top {
  background-color: #00b9ff;
  top: 12%;
  position: absolute;
  bottom: 6%;
  left: 0%;
  right: 0%;
  z-index: -1;
}

＆＃13;

<div id="bg-top"></div>

＆＃13;

使用用户

1 个答案: