Question

我想将我的页脚修复到底部间隙。我认为内容少了这个问题重复和内容完整的问题解决但我想内容较少没有显示差距我使用相同的页脚剩余页面所以帮助我任何一个。

Answer 1

如果内容较少，为什么不简单地将其修复到底部。我的意思是它最脏的黑客。

如果你想要干净的东西，请查看粘性页脚。

Answer 2

 $(function(){
    function adjust(){
       var winH = $(window).height(),
           docH = $('document').height();

       if(docH > winH){
          //leave it
       }else{
         $('.footer').addClass('fix-footer');
       }
    }
    $(window).on('resize',adjust);
 })



 .fix-footer{position:fixed; bottom:0; left:0; width:100%;}

Answer 3

最简单的方法是使用Flexbox。 flex属性指定项目将增加多少以填充剩余空间。

容器需要设置为display: flex，我们为正文设置min-height: 100vh，使其至少填满视口高度的100％。

CSS

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
}
main {
    flex: 1;
}

HTML

<body>
    <main>Main content goes here</main>
    <footer>Footer goes here</footer>
</body>

Answer 4

使用.main类作为容器将所有正文数据放入主容器

nil

Answer 5

=INDIRECT(ADDRESS((ROW($A1)-1)*3+COLUMN(A1),1))

CSS

<div class="footer"></div>

<强>位置绝对

这是一种非常强大的定位类型，允许您将任何页面元素准确地放置在您想要的位置。您可以使用顶部，左下角和右侧的定位属性来设置位置。

排名固定：

固定位置元素相对于视口或浏览器窗口本身定位。滚动窗口时视口不会改变，因此固定的定位元素将保持在页面滚动时的位置，

如何在不使用高度固定的情况下将页脚固定在底部间隙？

5 个答案: