Question

我一直试图解决这个问题好几天。我看到了很多关于它的问题，但没有一个解决方案似乎适合我。

我的网站有一个Bootstrap 3前端。我想要一个粘性的底部页脚，并且我使用Bootstrap的navbar navbar-fixed-bottom样式来实现这一目标。它工作正常，但问题是当没有足够的空间时内容将与页脚重叠。我希望能够在页脚和标题固定的情况下滚动内容，并且我不希望页脚与内容一起滚动。

Here is the site。您可以调整浏览器的高度以查看我正在谈论的内容。

任何帮助将不胜感激！

Answer 1

冰人，我在这里做的是帮助你解决这个问题我增加了身体的高度我没有使用body标签设置背景图片并修复它这样它现在滚动，菜单和页脚保持固定我也让背景图片没有重复。

这是你想要的吗？

以下是 Fiddle 。

你自定义css的css链接并不想在小提琴中打球，但在模拟中可以正常工作。

<style>
body{
   height:2000px; 
}
.bg-image {
    position: fixed;
    width: 100%;
    height:100vh;
    background: url('http://upload.wikimedia.org/wikipedia/commons/d/d3/Albert_Einstein_Head.jpg') no-repeat center center;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    z-index: -100;
}    
</style>

已更新。

对小提琴进行了更改，我添加了一个透明区域，作为2000px高度的内容。
我在这个内容的底部添加了一些余量。现在看看，看看你在这之后是不是这样这是一个完整尺寸 Fiddle 。

Bootstrap页脚覆盖内容

1 个答案: