100% 身体高度（内容动态加载）

Posted 2023-03-06

【中文标题】100% 身体高度（内容动态加载）

【英文标题】：100% Body Height (Content is loaded dynamically)

【发布时间】：2013-05-10 01:39:33

【问题描述】：

我喜欢在我的网站上都有背景。在内容静态时工作正常。 在使用 javascript 扩展内容时，body 元素不会在滚动区域上增长。 我的问题类似于这个问题：Div height 100% and expands to fit content

注意：我使用了很多浮动，无法制作固定的背景 div，因为我的网站无法访问。

需要以某种方式解决这个问题。也许用JS？

html, Body

  width: 100%;
  height: 100%;
  background-color: #ffffff;


Body 
  display: block;
  background: url('../Images/page-bgr-top.png') center top repeat-x,
              url('../Images/page-bgr-content.png') center top repeat-y;

更新：Nathan Lee 的回答帮助了我。我的问题是滚动条移动了背景，而我所有其他居中的内容都保持在原位。

body overflow:auto;

【参考方案1】：

将overflow:auto; 添加到您的身体中。

body overflow:auto;

希望这会有所帮助。

【讨论】：

是的哇，但是现在滚动条移动了背景，我所有其他居中的内容都保持在原位。

【参考方案2】：

将height: 100% 更改为min-height: 100%;：

html, body

  width: 100%;
  min-height: 100%;
  background-color: #ffffff;

您是在告诉您的 body 始终与窗口一样高，因此它实际上是这样运行的 - 不会扩展以适应文档的高度。使用 min-height 您可以让这种情况发生

在此处查看演示：http://jsfiddle.net/meyertee/Lpgwa/

【参考方案3】：

当您使用浮动时会发生这种情况，是否有任何理由使用浮动？尝试删除浮动并添加display: block;或display: inline-block？