即使使用动态高度网站，如何将页脚保持在底部

当我有一个使用 CSS 动态设置高度（例如从数据库获取信息）的页面时，如何将页脚 div 始终保持在窗口底部？

如果你想使用 jQuery，我想出了这个并且工作得很好：

设置页脚的 CSS：

#footer { position:absolute; width:100%; height:100px; }

设置脚本：

<script>
  x = $('#div-that-increase-height').height()+20; // +20 gives space between div and footer
  y = $(window).height();    
  if (x+100<=y){ // 100 is the height of your footer
    $('#footer').css('top', y-100+'px');// again 100 is the height of your footer
    $('#footer').css('display', 'block');
  }else{
    $('#footer').css('top', x+'px');
    $('#footer').css('display', 'block');
  }
</script>

该脚本必须位于代码末尾；

我想这会解决你所有的问题：

    <script>

  $(document).ready(function() {

   var docHeight = $(window).height();
   var footerHeight = $('#footer').height();
   var footerTop = $('#footer').position().top + footerHeight;

   if (footerTop < docHeight) {
    $('#footer').css('margin-top', 10+ (docHeight - footerTop) + 'px');
   }
  });
 </script>

您至少需要一个带有#footer

如果内容适合屏幕而不需要滚动条，只需将 10 的值更改为 0 如果内容不适合屏幕，则会显示滚动条。