gpt4 book ai didi

css - 如何使最后一个 div 拉伸(stretch)以填满屏幕?

转载 作者:太空狗 更新时间:2023-10-29 13:40:00 25 4
gpt4 key购买 nike

我有一个我正在尝试构建的网站,但我遇到了一个让我发疯的小障碍。本质上,在没有足够内容填充视口(viewport)的页面上,我想让最后一个 div(我的页脚)填充视口(viewport)的其余部分,但它目前被切断了。

我的 HTML 看起来像这样:

<body>
<div id="header"> </div>
<div id="subNav"> </div>
<div id="content"> </div>
<div id="footer"> </div>
</body>

我尝试使用 html, body, footer { height:100%; 但这会创建比需要更多的空间,本质上是页脚中空白内容的全屏长度。

如何在不添加滚动条的情况下让页脚填满屏幕的其余部分?

提前致谢,一个沮丧的编码员。

最佳答案

我很确定唯一的方法是计算绝对剩余高度。

IE,使用 jQuery

$('#footer').height( ($(window).height() - $('#header').height() - $('#subNav').height() - $('#content').height()) + "px" );

您可能希望在调整窗口大小时执行此操作以允许动态调整窗口大小。

$(window).resize(function(){...});

关于css - 如何使最后一个 div 拉伸(stretch)以填满屏幕?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/2435377/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com