Jquery 如何使div在加载时覆盖全屏

我试图弄清楚，当网站加载时，如何使我的初始登录区域拉伸以适应浏览器的整个视口（无论浏览器大小如何）。折叠的正下方，应该是我的内容

我尝试了几种不同的方法（将html和body设置为100%，然后让我想要适合屏幕的div继承它，将height设置为vh，但没有什么效果）。我也不确定这样做的最佳实践是什么

我将在下面发布我的代码-希望找出我做错了什么，我的选择是什么，以及最佳实践是什么

抱歉，如果代码有点长，我也在使用bootstrap3&sass

html正文{
字体系列：“Lato”，无衬线；
背景色：#ABB7B7；
身高：100%；
宽度：100%；
保证金：0；
填充：0；
}
html正文.登录页包装器{
背景色：#ABB7B7；
身高：100%；
最小高度：100%；
}
html正文。登录页包装。标题和主导航{
填充顶部：36px；
}
html正文。登录页包装。标题和主导航。公司名称{
颜色：#374A67；
字号：18px；
字体系列：pier-regular；
}
html正文。登录页包装。标题和主导航标志容器{
高度：200px；
背景色：#374a67；
文本对齐：居中；
}
html正文。登录页包装。标题和主导航。标志容器。公司标志{
颜色：#ECF0F1；
字体大小：72px；
字体系列：pier粗体；
文本转换：大写；
填充顶部：45px；
}
html正文。登录页包装。标题和主导航。导航ul{
列表样式：无；
文本对齐：右对齐；
}
html正文。登录页包装。标题和主导航。导航ul。导航-a{
文字装饰：无；
颜色：#374A67；
字体大小：16px；
字体系列：pier-regular；
}
html正文。登录页包装。报价板。报价前半部分{
字体系列：pier-regular；
字体大小：56px；
颜色：#ECF0F1；
填充顶部：75px；
}
html正文。登录页包装。报价板。报价下半部分{
字体系列：pier粗体；
字体大小：48px；
颜色：#ECF0F1；
}
html正文。登录页包装器。测试{
背景色：rgba（252252980.75）；
高度：299px；
宽度：自动；
边缘顶部：55px；
}
html body.landing page wrapper.test.intro copy one{
字体系列：pier-regular；
颜色：#374A67；
文本对齐：右对齐；
字号：28px；
线高：48px；
填充顶部：50px；
右边填充：20px；
左侧填充：20px；
}
html body.landing page wrapper.test.intro copy二{
字体系列：pier-regular；
颜色：#374A67；
文本对齐：右对齐；
字体大小：24px；
线高：48px；
右边填充：20px；
左侧填充：20px；
}
html正文。登录页包装器。测试。简介副本三{
字体系列：pier-regular；
颜色：#374A67；
文本对齐：右对齐；
字体大小：24px；
线高：48px；
右边填充：20px；
左侧填充：20px；
}
解决方案容器{
高度：200px；
背景颜色：粉红色；
}

霍格商业估值

乙型肝炎病毒





你的企业可能是你最宝贵的资产
难道你不知道它值多少钱吗？
三十多年来，Hogue的业务估值一直在下降

为大型和小型企业提供优质解决方案。

请在下面查找最适合您的。

您可以使用Jquery根据视口的大小设置特定的div

 $(document).ready(function(){
resizeDiv();
});

window.onresize = function(event) {
resizeDiv();
}

function resizeDiv() {
vpw = $(window).width();
vph = $(window).height();
$('#somediv').css({'height': vph + 'px'});
}

---

在div上使用100vh（视区高度）和100vw（视区宽度）作为高度。确保div的位置相对，并且具有零边距（顶部和左侧）。

正如其他人所建议的，我将使用100vh设置元素的高度。 但是，当您在全屏元素上方导航时，您需要考虑到它会将您的元素向下推一点。使用calc（）通过从视口高度减去导航高度来解决此问题

请参见此处的快速示例：

正文{
保证金：0；
文本对齐：居中；
}
导航{
高度：50px；
背景色：黑色；
线高：50px；
颜色：白色；
}
部分{
高度：计算（100vh-50px）；
背景颜色：橙色；
线路高度：100vh；
}

导航
在褶皱之上
这里所有隐藏的东西…

这就是我要做的吗？那么我下面的内容呢，它将从折叠下面开始？尝试添加网页将根据浏览器的宽度加载的那一行不起作用。把它贴在我的样式表下面。我并没有试图将整个网站的大小调整为视口的初始大小，只是初始着陆部分…尝试新的编辑…尝试将您的div id包含在$（“#somediv”）中。。？它有效吗？是的，从我所能看出它有效。如果我减小视口的大小，div下面应该覆盖整个视口的部分开始重叠。我需要隐藏溢出还是什么？我仍然需要将html和正文的高度和宽度设置为100%吗？不适用于此div，仅当您需要它用于