【问题标题】：Dynamically changing the height of a div [duplicate]动态改变div的高度[重复]
【发布时间】：2011-09-06 20:41:46
【问题描述】：

可能重复：
Height of a div

你好，

我有一个 DIV，我希望高度基于浏览器的可视区域 - 100 像素。有没有办法让我做到这一点，以便首先正确设置 DIV 高度，然后在用户进入并调整浏览器大小时进行调整。我想这会涉及到 javascript。

谢谢，

【问题讨论】：

有很多关于这个的现有问题.. 也许你可以尝试快速搜索？
看看here

标签： javascript css

【解决方案1】：

网上有个帖子Change DIV height/width with body width/height using jQuery

<script language=”javascript”>

$(document).ready(function(){

var height1 = $(document).height(); // height of full document

var height2 = $(“#header”).height(); // height of header

var height_diff = height1 – height2 + “px”;

document.getElementById(‘test’).style.height = height_diff; // Set the remaining height in test DIV.

});

</script>

其中test 是div 的ID。

【讨论】：

【解决方案2】：

仅 CSS 解决方案：

.foo {
    position: absolute;
    left: 50px;
    top: 50px;
    right: 50px;
    bottom: 50px;
    background-color: lime;
}

Demo here

【讨论】：