本文介绍了如何获取body元素的高度的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这里,所有< div> 的总高度为900像素,但jQuery函数将主体的高度返回为577像素。 (如果我删除正文CSS,它的工作)。

Here the total height of all <div>'s are 900 pixels, but the jQuery function returns the height of the body as 577 pixels. (If I remove the body CSS, it's working).

这个问题有解决方案吗?

Is there a solution for this problem?

$j(function() {
    alert($j("body").height());
})

html, body {
    height:100%;
}

<div style="height:200px">header</div>
<div style="height:500px">content</div>
<div style="height:200px">footer</div>


推荐答案

设置

html { height: 100%; }
body { min-height: 100%; }

而不是 height:100%

jQuery返回的结果是正确的,因为您已将body的高度设置为100%,这可能是视口的高度。这三个DIV导致溢出,因为BODY元素中没有足够的空间。要查看我的意思,请为BODY标签设置边框,然后检查边框的结束位置。

The result jQuery returns is correct, because you've set the height of the body to 100%, and that's probably the height of the viewport. These three DIVs were causing an overflow, because there weren't enough space for them in the BODY element. To see what I mean, set a border to the BODY tag and check where the border ends.

这篇关于如何获取body元素的高度的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

09-03 01:12