底部页脚boostrap v3

时间:2015-09-18 14:59:15

标签: footer navbar

我正在创建一个网站,我想在网站底部设一个页脚。

这是我的HTML:

<div class="navbar navbar-inverse navbar-fixed-bottom">
    <div class="container">
        <p class="text-muted">Copyright ©2015 Chalford Sports & Social Club | All rights reserved</p>
    </div>
</div>

我使用了bootstrap的基本CSS。

.navbar-fixed-top, .navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
}

我该怎么办?

1 个答案:

答案 0 :(得分:0)

你的HTML应该像

<body>
    <div id="wrap">


      <div class="container">

      </div>
    </div>

    <div id="footer">
      <div class="container">
            this is footer
      </div>
    </div>
</body>

并且您的css就像

html,
body {
  height: 100%;

}


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

#footer {
  height: 60px;
  background-color: #f5f5f5;
}

只是一个概念。根据需要使用classes进行游戏。fiddle