0

我知道这似乎是人们的普遍问题，我已经阅读了尽可能多的关于此事的信息，但我错过了一些东西。我按照引导站点上的示例作为模板，该站点具有响应性并可以调整大小。当它到达显示切换按钮的位置时，我单击并没有任何反应。这是在母版页上

头部 HTML：

<head runat="server"><meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
<link href="../Content/bootstrap.css" rel="stylesheet" />
<link href="../Content/Interior.css" rel="stylesheet" /> <!-- custom style sheet -->
<link href="../Content/normalize.css" rel="stylesheet" />
</head>

HTML：

<nav class="navbar navbar-default" role="navigation">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="navbar-collapse">
                        <span class="sr-only"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" href="#">Site Name</a>
                </div>

                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li><a href="#">Dash</a></li>
                        <li><a href="#">Edit Profile</a></li>
                        <li><a href="#">Invite</a></li>
                        <li><a href="#">Record A Message</a></li>
                        <li>
                            <p class="navbar-text">Connections <span class="badge">0</span></p>
                        </li>
                    </ul>
                    <ul class="nav navbar-nav navbar-right">
                        <li>
                            <p class="navbar-text">Sign out as <a class="navbar-link" href="Login.aspx">User</a></p>
                        </li>
                    </ul>
                </div>
            </nav>
...
<script src="../Scripts/jquery-2.0.3.min.js"></script>
    <script src="../Scripts/bootstrap.js"></script>
</body>
</html>

我将不胜感激有关此事的任何想法。

4

1 回答 1

2

您只需要在此行添加一个句点：

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">

（最终把它放在一起弄清楚：http: //jsfiddle.net/VDcnr/）

尽管我建议您在那里放置一个自定义类，以解决您最终在同一页面上有两个导航栏的奇怪角落情况。

另外，作为旁注，我很确定 normalize.css 包含在引导程序中，因此您不需要再次包含它。

于 2013-10-08T22:43:07.910 回答