twitter-bootstrap - 引导页脚问题

Question

在我的网站上，我使用的是引导程序，但是我的页脚没有留在页面底部。如何解决？我的网站是http://www.kewsplus.com/chunetest/blog.html来查看错误。页脚位于底部，但覆盖了网页中的一些文本，而且图像的位置也不正确。在主页上，您可以看到页脚实际应该是什么样子

任何帮助将不胜感激。

Answer 1

我通过萤火虫看到了你的 css，在 Wrap 和页脚 css 中必须有额外的属性。您可以从 Wrap 中删除边距并从 Footer 中删除高度。

旧 CSS

#wrap {
  height: auto !important;
  margin: 0 auto -60px;
  min-height: 100%;
}

footer {
   background-color: #FFFFFF;
   height: 60px;
   width: 100%;
}

更新的 CSS

#wrap {
  height: auto !important;
  min-height: 100%;
}  
footer {
   background-color: #FFFFFF;
   width: 100%;
}

Answer 2

您应该为您的页脚使用Bootstrap Navbar ，如下所示：

<nav class="navbar navbar-default navbar-fixed-bottom" role="navigation">
    ...
</nav>

见这里： http: //getbootstrap.com/components/#navbar-fixed-bottom

您还可以添加边距：

#wrap {
  height: auto !important;
  min-height: 100%;
  margin: -60px 0 auto -60px;
}

但如果您使用 Bootstrap，我鼓励您使用 Bootstrap 页脚。

Answer 3

页脚位于 Chrome 页面的底部，但我无法滚动页面。我不确定你在问什么。

您无法将字体设置为粗体的可能原因是您没有在页面中包含粗体版本。如果我这样做，它工作正常：

p {
    font-family: arial;
    font-weight: bold;
}

您需要在样式表中链接“Open Sans”的重量级版本。