我试图将一个大容器 div 放置在浏览器底部 上方 60 像素处，以便为视频流和静止图像腾出空间，非常类似于 this解决方案在这里。
与常见的粘性/固定类型页脚不同，容器在访问页面和随后的浏览器调整大小时保持在其位置 - 但可以向上滚动以供想要浏览网站内容的用户使用。
查看示例站点，我可以看到 CSS 属性“top”在浏览器调整大小时发生变化，但我找不到实现此目的的机制。
我应该如何实现这种 flex ？
非常感谢您!
最佳答案
您可以按照以下方式使用 Javascript 执行此操作
setTop = function(e) {
document.getElementById('content').style.marginTop = window.innerHeight - 60;
};
window.onresize = setTop;
完整的工作示例:
<html>
<head>
<title>My Page</title>
<style type="text/css" media="screen">
#content {
width: 80%;
margin: 0 auto;
border: 1px solid black;
height: 100%;
}
</style>
</head>
<body>
<div id="content">
Here is the content...
</div>
<script type="text/javascript" charset="utf-8">
setTop = function(e) {
document.getElementById('content').style.marginTop = window.innerHeight - 60;
};
setTop();
window.onresize = setTop;
</script>
</body>
</html>
关于CSS 定位 : container always 60px off browser bottom, 但可滚动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11374424/