html - 固定到顶部导航栏不工作

Question

我正在使用 Twitter Bootstrap 并且我希望菜单在滚动时停留在浏览器顶部。导航栏首先到达浏览器的顶部，但在滚动时它会被滚开。我正在使用在 twitter bootstrap 上找到的菜单的标准设置

<nav class="navbar navbar-fixed-top" id="navbar" role="navigation">
    <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <a class="navbar-brand animated fadeInDown" href="<?php bloginfo('url'); ?>">
                <img class="center brand-logo" style="margin-top: 18px;" height="30px" src="<?php bloginfo('template_directory'); ?>/img/Triday-fat.png" alt="Loggan för Triday, designade hemsidor till ett lågt pris"/>
            </a>
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
        <ul class="nav navbar-nav">
            <?php
                wp_nav_menu( array(
                    'menu'              => 'primary',
                    'theme_location'    => 'primary',
                    'depth'             => 2,
                    'container'         => 'div',
                    'container_class'   => 'collapse navbar-collapse navbar-ex1-collapse',
                    'menu_class'        => 'nav navbar-nav',
                    'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                    'walker'            => new wp_bootstrap_navwalker())
                );
            ?>
          </ul>
    </div> <!--  /. container-fluid-->
</nav>

css 是标准的 Bootstrap ，但当它不起作用时我尝试添加

.navbar { position: fixed; width: 100%; height: 60px; top: 0; }

如果有人能帮我弄清楚我做错了什么，我将不胜感激!

Answer 1

这就是固定顶部导航栏所需的全部内容:

<header class="navbar navbar-default navbar-fixed-top " id="top" role="banner">


</header>

试一试 here一个 Boot 。 Here是上面的文档。