添加下拉菜单时，导航栏会更改颜色

Question

我的主页上有一个黑色的导航栏，但当我转到另一个页面（带下拉列表）时，导航栏变为白色。如何在两个页面上保持黑色？

指向主页：index.html

链接到字母：slider.html.php

index.html的导航条形码

<nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i>
            </button>
            <a class="navbar-brand page-scroll" href="#page-top">German War Letters</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">
                <li>
                    <a class="page-scroll" href="#about">About</a>
                </li>
                <li>
                    <a class="page-scroll" href="#contact">Where to find the book</a>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
</nav>

slider.html.php的导航条形码

<nav id="mainNav" class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
                <span class="sr-only">Toggle navigation</span> Menu <i class="fa fa-bars"></i>
            </button>
            <a class="navbar-brand page-scroll" href="index.html#page-top">German War Letters</a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right">

                                    <!--PAUL DROPDOWN CHAPTERS-->
                                        <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown">Chapters
                                            <span class="caret"></span>
                                            </button>
                                        <ul class="dropdown-menu">
                                          <li><a href="slider.html.php?chapter=Introduction">Introduction</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter2TheHellerFamily">Chapter 2 The Heller Family</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter3HeinrichBredemeier">Chapter 3 Heinrich Bredemeier</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter4TheKetschauFamily">Chapter 4 The Ketschau Family</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter5RudolfZwingenberger">Chapter 5 Rudolf Zwingenberger</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter6TheJagelFamily">Chapter 6 The Jagel Family</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter7ErichKohler">Chapter 7 Erich Kohler</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter8Sgt.WalfriedGlase">Chapter 8 Sgt. Walfried Glase</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter9MomentsinTime">Chapter 9 Moments in Time</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter10TheHomefront">Chapter 10 The Homefront</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter11IntotheAbyss">Chapter 11 Into the Abyss</a></li>
                                                <li><a href="slider.html.php?chapter=Chapter12Sowhydidtheyfight">Chapter 12 So why did they fight?</a></li>
                                        </ul>
                                    <!--END PAUL-->
                                    <li>
                    <a class="page-scroll" href="index.html#about">About</a>
                </li>
                <li>
                    <a class="page-scroll" href="index.html#contact">Where to find the book</a>
                </li>
            </ul>
        </div>
        <!-- /.navbar-collapse -->
    </div>
    <!-- /.container-fluid -->
</nav>