Bootstrap导航菜单固定在底部

时间:2015-03-24 13:32:08

标签: html css wordpress twitter-bootstrap

我创建了一个WP主题:

header.php中的代码

 <div class="navbar navbar-inverse navbar-fixed-bottom">
    <div class="navbar-inner">
      <div class="container">
        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
          <span class="icon-bar"></span>
        </a>
        <a class="brand" href="<?php echo site_url(); ?>"><?php bloginfo('name'); ?></a>
        <div class="nav-collapse collapse">
          <ul class="nav">

              <?php wp_list_pages(array('title_li' => '', 'exclude' => 4)); ?>

          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </div>
  </div>

当菜单窗口为980px时,上下只有一切

我把图片更好地理解

http://i61.tinypic.com/15heu55.jpg

每次如何定位菜单?

1 个答案:

答案 0 :(得分:0)

您需要将position: static覆盖为position: fixed

将此媒体查询添加到您的style.css

@media (max-width: 979px)
.navbar-fixed-bottom {
  margin-top: 20px;
  bottom: 0;
  position: fixed;
}