我想要一个 100 像素的页脚，但是当滚动被“向下推”时，它也会显示在页面末尾之外。滚动到页面末尾并继续滚动，然后浏览器会自动将其拉回。这个概念就像在 html 元素上设置颜色。我不能让它显示在 body 的尽头之外:
<footer style="position:absolute;bottom:-100px;
left:0; width:100%;height:100px;">
<div style="width:100%; height: 300px;
background-image:url('/img.jpg')"></div>
</footer>
这会增加页面的高度，如果我设置 overflow: hidden 那么我就得不到我想要的效果。有什么办法可以做那种事。我想要一个 div，因为我有一些 JS 需要在那里工作...
最佳答案
你想要完成的事情是不可能的。您最多只能更改显示的颜色。
<html>
<head></head>
<body style='margin: 0px; background-image: url("https://stackoverflow.com/favicon.ico"); background-color: red;'>
<main style="padding: 8px;background:white;">
<h1>Body</h1>
<p>
body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
<br>body<br>body<br>body<br>body<br>body<br>body<br>body
</p>
</main>
<footer style="display:block;position: relative;height: 100px; overflow:hidden">
<div style="width:100%; height: 300px; background-color: red; background-image:url('https://stackoverflow.com/favicon.ico');">
</div>
</footer>
</body>
</html>关于html - 如何在不增加正文大小的情况下使页脚超出页面末尾，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57966153/