我怎样才能让这个页脚最终做到我想要的呢？会喜欢一些建议

Question

当我为页脚css做这样的事情时

footer {
position: fixed;
top:800px;
left:0;
width:100%;
height:80px;
}

当我从底部向上调整浏览器窗口的大小时，当然，页脚不会移动并且不会与我的主要内容重叠，这很好，但是，当以不同的屏幕尺寸查看网站时，页脚是固定的页脚对于某些屏幕尺寸，当然是在底部，然后是较大尺寸，当然它不在底部，因为它是固定的。所以我最终会喜欢这样的页脚：

footer {
position: fixed;
top:90%;
left:0;
width:100%;
height:80px;
}

这会创建一个停留在页面底部的页脚，无论是否调整大小，它都可以重叠内容。我希望有一个固定的页脚，始终保持在底部但从不重叠内容。

我可以将媒体查询用于流行的尺寸，但当然在某些尺寸下它无法解决。 任何人都可以帮助我吗？

Answer 1

footer {
  position: fixed;
  bottom:0;
  left:0;
  width:100%;
  height:80px;
}

然后为您的内容提供至少80px的底部填充。你为什么无论如何使用top？