javascript - 无法向下滚动以查看页脚

Question

我是一名(荷兰)一年级学生，主修 ICT 和媒体设计，我们正在使用 HTML/CSS/JavaScript。

在为自己创建一个页面以使用 javascript、html 和 css 时，我偶然发现了一些问题。

我无法向下滚动以查看页面上的页脚。我很确定我在固定位置上做错了什么，但我似乎无法找出到底是什么。

希望你们能帮助我，可能还有更多错误的定位明智。

提前谢谢你。

http://athena.fhict.nl/users/i299291/WP21/index.html(学校服务器)

Answer 1

您的页脚没有出现，因为您使用了不必要的使用位置。从 CSS 中删除所有 position:fixed 和 position:absolute，然后页面将可滚动，您可以看到页脚。

这是更新后的 CSS；你可以看到所有位置都被注释了，不需要使用它们。

#header {
    margin-left: auto;
    margin-right: auto;
    margin-top: 15px;
    position: relative; /* remove this line*/
    width: 100%;
}

#menubar {
    background-color: #2C2C2D;
    border: 1px solid #FFFFFF;
    height: 51px;
    line-height: 20px;
    margin: 261px auto 0; /* remove this line*/
    position: absolute; /* remove this line*/
    text-align: center;
    vertical-align: middle;
    width: 1280px;
}
#containerIndex {
    background-color: #FFFFFF;
    height: 530px;
    margin-top: 330px;
    opacity: 0.5;
    position: fixed; /* remove this line*/
    width: 1280px;
}
#footer {
    background-color: #C6C7C0;
    border: 1px solid #FFFFFF;
    height: 48px;
    line-height: 50px;
    margin: 880px auto 10px;/* remove this line*/
    position: fixed;/* remove this line*/
    text-align: center;
    vertical-align: middle;
    width: 1280px;
}