Navbar Toggler在Bootstrap 4中不起作用

时间:2019-05-05 18:13:49

标签: bootstrap-4 navbar

我是CSS的初学者,正在使用Bootstrap / HTML开发导航栏,但是“切换”按钮不起作用。我无法找到确切的错误/原因。

此代码与在AWS服务器上运行的基于Bootstrap 4的PHP 7网站一起用作标题/导航栏。

<header class="globel-header" style="z-index: 1">
    <div class="row">
        <section class="site-header col-xs-12 col-sm-12 col-md-12 col-lg-12">
            <div class="head-scroll-content col-xs-12 col-sm-4 col-md-4 col-lg-4"> </div>

            <div class="extn-bar col-xs-12 col-sm-8 col-md-8 col-lg-8"> <a href="/how-it-works">HOW IT WORKS?</a><span> |</span> <a href="" target="_blank">DOWNLOAD APP</a>

                                <span>|</span>
                <a href="/user" style="color: purple"><b>PENDING: Rs. 0</b></a><span>|</span>
                <a href="/user" style="color: orange"><b>CONFIRM: Rs. 0</b></a><span>|</span>
                <a href="/logout">LOGOUT</a>
                            </div>
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 site-header-sub-section" id="navBarFixed" style="z-index: 1">


                <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2 mobile-menu"> <img class="mobile-menu-btn" src="/images/baricon.png"> </div>
                <a href="/" class="col-xs-5 col-sm-2 col-md-2 col-lg-2 home-page-head"> <img alt="CashBackPe.com" class="desktop-img" src="/images/logo_CPE.png"> <img alt="CashBackPe.com" class="mobile-img" src="/images/logo_CPE.png"> </a>
                <section class="header-bottom col-xs-12 col-sm-5 col-md-5 col-lg-5">
                    <div class="mobile-close col-xs-12 col-sm-12 col-md-12 col-lg-12"> <img class="mobile-close-btn" src="/images/crossicon.png"> </div>
                    <div class="divider pos header-nav col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <nav class="head-category col-xs-12 col-sm-12 col-md-12 col-lg-12">
                            <ul class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                                <li id="stores-nav-head"><a href="/stores/all/" class="">CATEGORY<i class="pos"></i> </a>
                                </li>
                                <li id="all-stores-head-mobile"><a href="/stores/all/" title="All stores"> CATEGORY</a>
                                </li>
                                <li><a href="/stores/all/" title="Today's top Deals" class="hghlghtr-link"> ALL STORES</a>
                                </li>
                                <li id="top-couopons-head"><a href="/stores/coupons/" title="Top Coupons"> BEST OFFERS <sup style="
                      color: red">*</sup></a>
                                </li>
                                <li id="sales-head" class="instant-cb"><a href="/stores/coupons/" title="Best Cashback Stores"> TOP COUPONS<i class="pos"></i> </a> </li>
                            </ul>
                        </nav>
                    </div>
                </section>
                <div class="search-holder col-xs-12 col-sm-3 col-md-3 col-lg-3">
                    <div class="mobile-close col-xs-12 col-sm-12 col-md-12 col-lg-12"> <img class="mobile-close-btn" src="/images/crossicon.png"> </div>
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
                        <form action="/stores/search/index.php" method="get">
                            <input type="text" placeholder="Search Your Favourite Store &amp; Enter" name="query" class="search-input col-xs-11 col-sm-11 col-md-11 col-lg-11" value="">
                            <input class="searchStoresIcon col-xs-1 col-sm-1 col-md-1 col-lg-1" id="searchSubmit" type="submit" value="">
                        </form>
                    </div>
                </div>

                <div class="elm-container col-xs-5 col-sm-2 col-md-2 col-lg-2">
                    <div class="mobile-search col-xs-6 col-sm-6 col-md-6 col-lg-6"> <img class="mobile-search-btn" src="/images/searchicon.png"> </div>
                    <div class="login-mobile col-xs-6 col-sm-6 col-md-6 col-lg-6"> <a href="/login/"><img class="login-mobile-btn" src="/images/usericon.png"></a> </div>
                </div>







                <div class="login-box col-xs-5 col-sm-2 col-md-2 col-lg-2">
                    <div class="mobile-close col-xs-12 col-sm-12 col-md-12 col-lg-12"> <img class="mobile-close-btn" src="/images/crossicon.png"> </div>

                                        <a href="/user/" class="desk-user-login">My Account<img alt="" src="/images/usericon.png"></a>


                    <a href="/how-it-works" class="mobile-elm col-xs-12 col-sm-6 col-md-6 col-lg-6">HOW IT WORKS?</a> <a href="/contact-us" class="mobile-elm col-xs-12 col-sm-6 col-md-6 col-lg-6">CONTACT US</a>
                </div>



            </div>
        </section>
    </div>
</header>

有人会指导我完成调试过程,以便在所附的代码中找到错误吗?

0 个答案:

没有答案
相关问题