Html 在所有其他内容后面放置文档长度和宽度div

我有布局。“其他位置”应该包含真正的页面内容。整个页面框应该放在所有其他内容的后面。我可以用位置：绝对和z指数。问题是，我需要整个页面框来获取整个页面的宽度和高度，而不是屏幕的宽度和高度。这是因为这个div将包含一个SVG元素，JS将用于根据用户与其他内容的交互来绘制内容。正如您在示例中所看到的：

position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
height: 100%;
width: 100%;

---

没有实现我想要的。什么会？提前感谢您的帮助。

您没有为文档的高度设置任何值，因此100%默认为窗口大小

首先，您需要为身体的高度和宽度设置一个绝对值，例如

然后，您可以去掉在整个页面框上所做的大部分样式设置，并在其中添加一个z索引：

#whole_page_box {
    z-index: -1;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 255, 0, .1);
}

当然，由于主内容div的垂直偏移量为100px，因此需要将100px固定到身体高度。车身宽度也是如此

如果从数据库加载内容，可以使用jQuery或纯JS获取文档的宽度和高度，然后更改正文的高度，如下所示：

$(document).ready(function({
    var docH = $(document).width();
    var docW = $(document).height();
    $('body').css('width', docW).css('height', docH);
});

---

你能添加显示问题的屏幕截图吗…？你可以在行动中看到它@。好的。但是内容应该来自数据库。我不知道内容的高度和宽度。我只输入这些高度和宽度值，以使滚动条显示所有屏幕大小；使用jQuery获取文档的高度/宽度，然后将其设置为正文高度/宽度。我正在寻找一个基于CSS的解决方案。如果可能的话，我不希望页面上出现与布局相关的JS。

$(document).ready(function({
    var docH = $(document).width();
    var docW = $(document).height();
    $('body').css('width', docW).css('height', docH);
});