gpt4 book ai didi

css - 位置 : absolute; bottom: 0; go to bottom of page

转载 作者:行者123 更新时间:2023-11-28 15:13:45 26 4
gpt4 key购买 nike

如何让绝对定位的元素到达页面底部?

我想在我的页面上创建一个“封面”。为了让它覆盖整个页面,我使用了“position: absolute”,四个方向都设置为0。但是,当页面内容的高度大于客户端窗口的高度时,覆盖高度为客户端高度,而不是整个页面的高度。

JS Bin

<style>

#a {
width: 100px;
height: 2000px;
background: red;
}

#b {
position: absolute;
bottom: 0;
width: 200px;
height: 200px;
background: blue;
}

</style>

<div id=a></div>

<div id=b></div>

我首先尝试将此问题诊断为 <body></body> 的问题高度。像这一步这样的大多数问题源于 <body></body>不会延伸到页面底部。但是,您会注意到,在此示例中,正文实际上确实将 2000 像素延伸到页面底部。

请注意 position: fixed不起作用,因为用户仍应能够滚动并且封面内的内容应随页面滚动

最佳答案

我想通了!

你只需要元素的“包含 block ”作为主体,所以你只需要设置 <body></body>成为position: relative

关于css - 位置 : absolute; bottom: 0; go to bottom of page,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47759725/

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