html - 使用导航栏 Bootstrap 静态页脚

标签 html css twitter-bootstrap footer

<分区>

我使用以下代码通过 Bootstrap 创建页脚:

<nav class="navbar navbar-default navbar-fixed-bottom">
    <div class="container">
        <div class="navbar-header">
            <span class="navbar-brand">Ok Bye</span>
        </div>

        <p class="navbar-text navbar-right">company &copy; 2017</p>
    </div>
</nav>

我想在页面底部有一个静态的页脚,而不是一直在viewport 中可见的。 Bootstrap 方法是什么?

最佳答案

静态页脚在 Bootstrap 中有一个实现。您不需要使用 <nav>

CSS:

/* Sticky footer styles
-------------------------------------------------- */
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  /* Set the fixed height of the footer here */
  height: 60px;
  background-color: #f5f5f5;
}

HTML:

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

关于html - 使用导航栏 Bootstrap 静态页脚,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43055979/

上一篇:css - 如何在 CSS 中设置每个元素之间的边距?

下一篇:javascript - CSS 光标指针覆盖元素列表拖动上的内联样式光标

相关文章:

javascript - CSS、JavaScript风格的动态表格

html - Bootstrap 定制

javascript - 从被点击的元素image src中放入image src并更新数据

php - 如何将日期的文本颜色更改为白色?

html - 全页宽度边框,居中内容,最好的方法?

html - 如何让 Quasar q-page-container child 使用其祖 parent 的全高?

javascript - 使用 window.pageYOffset 滚动点/overflow-y 破坏 javascript 函数

html - 将 Bootstrap CSS 与自定义 CSS 一起使用

css - 如何在 Bootstrap 表中为复选框列添加标题

javascript - 单击另一个选项卡时停止视频