Question

网页运行正常但是当我改变它的大小（缩小）并点击按钮时它不会崩溃。这是我的代码。

   <!DOCTYPE html>
    <html>
        <head>
            <title>Template 1</title>
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <link rel="stylesheet" href="css/bootstrap.min.css">

        </head>

        <body>

            <div class="navbar navbar-inverse navbar-static-top">
                <div class="container">
                    <a href="#" class="navbar-brand">zdfgdfgf</a>
                    <a class = "navbar-toggle" data-toggle = "collapse" data-target = ".navHeaderCollapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>

                    </a>

                    <div class = "collapse navbar-collapse navHeaderCollapse">
                        <ul class = "nav navbar-nav navbar-right">
                            <li class="active"><a href = "#">Home</a></li>
                            <li><a href = "#">Social media</a></li>
                            <li><a href = "#">About</a></li>
                            <li><a href = "#">Contact</a></li>


                        </ul>
                    </div>
                </div>
            </div>

            <script src="js/bootstrap.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
        </body>
    </html>

任何人都可以帮忙吗？

this happened after fixing the collapsing problem using the 1st answer

Answer 1

一个问题是必须在jquery之后加载bootstrap.js，如下所示：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>

在bootstrap中折叠不起作用

1 个答案: