javascript - 将 高度设置为浏览器窗口的底部

Question

虽然看起来应该有办法做到这一点，但我开始怀疑没有。

我有一个内容 <div>位于我页面的某处。

+---------------------------+
| Header                    |
+---------------------------+
|         |                 |
| Sidebar | Content         |
|         |                 |
|         |                 |
|         |                 |
+---------+-----------------+

我想做的是设置内容的高度<div>这样底部等于浏览器窗口的底部。

我知道我可以用绝对定位来做到这一点。但是在现有布局中没有办法做到这一点吗？如果唯一的方法是使用 JavaScript/jQuery，那么我很想看看它是如何实现的。

最终，我的目标是制作这个 <div>可使用 overflow-x: auto 滚动.但我必须有一个固定的高度才能让它工作。

Answer 1

您必须在此处使用 javascript - 当 dom 准备就绪时，将内容的高度设置为窗口的高度 - 标题的高度

$('#content').height($(window).height() - $('#header').height());