簡體   English   中英

bootstrap 3導航欄切換不顯示任何點擊

[英]bootstrap 3 nav bar toggle not displaying anything on click

我知道這對人們來說似乎是一個普遍的問題,我在這件事上已經讀了很多,但是我錯過了一些事情。 我按照引導站點上的示例作為模板進行了跟蹤,該站點具有響應能力,並且可以按預期大小進行調整。 當它到達顯示切換按鈕的位置時,我單擊並沒有任何反應。 這是在母版頁上

頭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>

我對此表示感謝。

您只需要在此行上添加一個句點:

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

(最終將其匯總以解決問題: http : //jsfiddle.net/VDcnr/

盡管我建議您在此處放置一個自定義類,以應對奇數個角的情況,但最終您會在同一頁面上有兩個導航欄。

另外,作為一個旁注,我很確定normalize.css包含在引導程序中,因此您無需再次包含它。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM