时间戳

首页 > 解决方案 > HTML/CSS - 整个页面的 100% 高度，而不仅仅是当前屏幕

html - HTML/CSS - 整个页面的 100% 高度，而不仅仅是当前屏幕

问题描述

所以，我知道这是困扰我之前其他人的事情，但我根本无法让它发挥作用。我目前正在处理一个 1000 像素宽度的居中背景，该背景应该适用于整个页面。带高度：100%；我可以让它填满整个屏幕，但如果我有需要滚动的 Div，则底部缺少背景。

我搜索了互联网来解决这个问题并找到了一堆解决方案，但似乎没有一个对我有用。其中：

还有很多。

这是我的代码。

HTML

<body>
    <div class="headerMenu">
        <div id="wrapper">
            something
        </div>
    </div>
    <div class="signMenu">
        <div class="div_one">
            something
        </div>
        <div class="div_two">
            something
        </div>
    </div>
</body>

CSS

html, body {
margin: 0;
padding: 0;
width: 100%;
height:100%; }

.signMenu {
padding-left: auto;
padding-right: auto;
width: 1000px;
margin-left: auto;
margin-right: auto;
position: relative;
background-color: white;
height:100%; }

.div_one {
background-color: rgb(250, 250, 250);
height: 1250px;
width: 400px;
position: absolute;
top:105px;
left: 0px;
margin-left: 30px;
}

.div_two {
background-color: rgb(250, 250, 250);
height: 1200px;
width: 400px;
position: absolute;
top:120px;
right: 0px;
margin-right: 30px;
}

现在忘记 headerMenu 和包装器。关键是，如果/当 div 1 和 2 超过屏幕的高度时，就会出现滚动条，而当我从 signMenu 向下滚动白色背景时，不会再继续了。我希望该背景填充整个页面（无论滚动多久），而不仅仅是特定的窗口大小，它使用高度：100%;。

我希望这是有道理的。我对此有点陌生。提前致谢！

标签： htmlcss

解决方案

推荐阅读