Bootstrap響應式導航欄不崩潰

好吧，所以我幾乎直接從文檔中獲取，似乎沒有任何工作（我現在實際上是直接撕掉他們的HTML而不是僅僅是示例）。Bootstrap響應式導航欄不崩潰

首先我的頭部分，其中「模板」文件是我的自定義文件：

<head> 
<title>Hello World</title> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<link href="/assets/responsive_template/css/bootstrap.css" rel="stylesheet"> 
<link href="/assets/responsive_template/css/bootstrap-responsive.css" rel="stylesheet"> 
<link href="/assets/responsive_template/css/template.css" rel="stylesheet"> 

<script src="/assets/responsive_template/js/jquery.js"></script> 
<script src="/assets/responsive_template/js/jquery-ui-1.10.0.min.js"></script> 
<script src="/assets/responsive_template/js/bootstrap.js"></script> 
<script src="/assets/responsive_template/js/template.js"></script> 
</head>

現在實際的導航欄部分：

<div class="navbar"> 
    <div class="navbar-inner"> 
     <div class="container"> 
      <a href="#" class="btn btn-navbar" data-toggle="collapse" data-target=".navbar-responsive-collapse"> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </a> 
      <a class="brand" href="#">Prototype</a> 
      <div class="nav-collapse collapse navbar-responsive-collapse"> 
       <ul class="nav"> 
        <li><a id="back-button" href="#">Back</a></li> 
        <li><a id="submit-button" href="#">Submit</a></li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div>

但是運行這個沒什麼崩潰...它只是在我的iPhone上佔據了三條線。我沒有看到任何錯誤通過鉻控制檯時，其940像素以下...任何想法？

來源

2013-02-14 Msencenb

如果您可以創建一個測試頁，那將會很棒。通過測試頁面找到答案和幫助變得更容易 – Shail 2013-02-14 01:58:14

這裏是我爲你創造的Jsfiddle - http://jsfiddle.net/shail/F4NfT/10/工作！

<head> 
<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap-combined.min.css" rel="stylesheet"> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/js/bootstrap.min.js"></script> 
</head> 

    <div class="navbar"> 
<div class="navbar-inner"> 
<div class="container"> 

<!-- .btn-navbar is used as the toggle for collapsed navbar content --> 
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
<span class="icon-bar"></span> 
</a> 

<!-- Be sure to leave the brand out there if you want it shown --> 
<a class="brand" href="#">Project name</a> 

<!-- Everything you want hidden at 940px or less, place within here --> 
<div class="nav-collapse collapse"> 
<!-- .nav, .navbar-search, .navbar-form, etc --> 
</div> 

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

來源

2013-02-14 02:26:48 Shail

嗯我仍然無法使本地工作，但即使在這個小提琴下拉本身不工作http://jsfiddle.net/SQLP4/ – Msencenb 2013-02-14 02:50:29

朋友，我沒有插入菜單項目...用菜單項更新它...再次檢查它的工作 – Shail 2013-02-14 03:02:18

謝謝，我從你的小提琴注意到你使用2.3.0 ...似乎我有一個bootstrap 2.2.0的副本，並試圖使用2.3.0語法！ – Msencenb 2013-02-14 07:01:05

Bootstrap響應式導航欄不崩潰

回答

相關問題