请问网页内容高度不够的情况下,怎么让底部排下来啊?

好图所示：

空了好多，我想让底部排下来

---

可以貼下你的代碼嗎？CSS 和 HTML，因為根據不同的佈局寫法有不同的應對方式，如果是用 Flexbox 那恭喜你，只要幾行～

<div class="container">
  <header></header>
  <content></content>
  <footer></footer>
</div>

.container {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

header {
  background: #cecece;
  min-height: 100px;
}

content {
  background: #bbbbbb;
  flex: 1; /* 1 代表盡可能最大，會自動填滿除了 header footer 以外的空間 */
}

footer {
  background: #333333;
  min-height: 100px;
}

例子

---

使用fixed属性，通过js设置元素top的值。

footer{position：fixed;}

底部高度为300px，那么：
var $height = $(window).height();
$("footer").css("top",$height-300);

---

楼上给出了flex布局和js控制的解决办法，如果只是针对一种显示设备，给中间那块设置min-height也可以把底部撑下去，不过针对不同高度显示器的，还是要js来判断具体要设置的最小高度

---

main.style.minHeight = (window.innerHeight - header.offsetHeight - footer.offsetHeight) + 'px'

这样兼容性好。

---

<div id="footer_box">
    <div id="footer"></div>
</div>
#footer_box {
    left: 0px;
    bottom: 0px;
    height: 60px;
    width: 100%;
}
#footer {
    position: fixed;
    left: 0px;
    bottom: 0px;
    height: 62px;
    width: 100%;
    background: #444;
}

/* IE 6 */
* html #footer {
    position: absolute;
    top: expression((0-(footer.offsetHeight)+(document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body.clientHeight)+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop))+'px');
}