Javascript 设置<；部门>；大小是否与窗口相同？

我试图使用jQuery设置div的高度，使其占据整个窗口+页眉的高度（以便您可以将页眉从页面上滚动），但不能超过这个值。我认为div的高度应该是窗口的高度+我试图隐藏的标题的高度

但是，当我将div设置为windowheight时，它会产生溢出。以下是大致代码：

var$body=$（“#body”），
$container=$（“#container”），
$window=$（window），
$content=$（“#mainContent”），
$header=$（“#header”），
bodyHeight=window.innerHeight+$header.height（）；
$body.css（“高度”，window.innerHeight）；
$container.css（“高度”，车身高度）
div{
显示：块；
宽度：100%；
保证金：0；
}
#身体{
溢出y：滚动；
}
#容器{
溢出y：隐藏；
}
#标题{
溢出：隐藏；
}
#导航栏{
高度：10px；
背景颜色：棕色；
}
#主要内容{
高度：200px；
溢出y：滚动；
}
#内容{
高度：400px
}

标题
这是内容
我查看了您的代码并对其进行了修改。试试这个，看看这是不是你想要的

在我的示例中，我通过
getElementById
查找元素，然后将其设置为
style.height
到
window.innerHeight-10px
，如果不使用
10px
，它将无法在页面上完全显示边框。所以您只需删除
10px
。该示例已经在不同的屏幕尺寸上进行了测试

Javascript示例：


函数autoResizeDiv（）{
document.getElementById（'body'）。style.height=window.innerHeight-10+'px'；
console.log（window.innerHeight-10+'px'）；
}
window.onresize=autoResizeDiv；
autoResizeDiv（）
#主体{
显示：块；
边框：5px纯黑；
}
身体{
溢出：隐藏；
保证金：0；
}
以下几点对我很有用：

$(".body").height($(window).height());

我发现了最大的问题。我使用了一些绝对定位的元素，没有给父母任何其他位置。这让我在衡量其他东西的时候显得有些不稳定。我还需要一个额外的div作为页面上所有内容的容器，即窗口的高度+页眉的高度

感谢所有回答的人，这很有帮助
 可能是因为默认的
边距
。请参见此处，无
页边距
：绝对是页边距。您可能希望考虑将其合并到您的项目中。@EricMcCormick包括normalize.css有帮助，但我在我的网站上仍然遇到同样的问题。在我的浏览器（Chrome）中查看这个问题也会出现同样的问题。div略大于窗口，导致溢出。这可能是webkit或其他方面的问题吗？@BillyR-我已经更新了这个答案，它现在只使用JavaScript，我已经测试过了，它在Chrometh中运行良好。它确实做到了你所说的，但应用它并没有解决我不幸遇到的问题。我已经更新了我的问题，以便更清楚地了解我的目标，并且可能会得到一个可行的解决方案。谢谢你迄今为止的帮助。