当页面内点击内容较少时修复页脚

Question

当单击内容更改时所有屏幕上的内容较少时，我如何将页脚固定为始终底部，并且仅当内容较少时将其固定到底部 CSS 或 Jquery

Answer 1

我想这对你有帮助。通过使用 footer{ position: fixed;z-index: 100;bottom: 0; width: 100%;} 你可以实现固定页脚。

footer {
    position: fixed;
    z-index: 100; 
    bottom: 0; 
    width: 100%;
}

<!DOCTYPE html>
<html>
<style>

</style>
<body>

<footer>
  <p>Posted by: Someone</p>
  <p>Contact information: <a href="mailto:someone@example.com">someone@example.com</a>.</p>
</footer>

</body>
</html>

Answer 2

你能试试下面的方法吗

<html>
 <body>
  <div id="wrap">
     MY Content
  </div>
 <footer class="footer" id="appfooter">
   <div>
    MY Footer
   </div>
 </footer>
 </body>
</html>

css class（您也可以根据需要添加更多属性）

 .footer {
    clear: both;
    text-align: center;
  }

文件准备就绪

var footerheight = $('.footer').innerHeight();
var browserheight = $(window).height() - footerheight ; //footerheight
$("#wrap").css("min-height", browserheight);

当页面内点击内容较少时修复页脚

Have footer fixed when less content on clicks within page

jquery

css

fixed