漢堡包和下拉菜單不能在移動設備上顯示使用Bootstrap導航欄

我一直在這裏搜索板子，沒有任何東西可以掩蓋什麼可能是錯的。我的導航欄一切都很好，但當我移動時，沒有漢堡或菜單顯示。我試過改變組合並實現不同的摺疊名稱，但無濟於事。有任何想法嗎？這裏是我的代碼：漢堡包和下拉菜單不能在移動設備上顯示使用Bootstrap導航欄

 <header class="navbar navbar-custom" role="banner"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
    </div> 
    <nav class="collapse navbar-collapse" role="navigation"> 
      <ul class="nav navbar-nav pages"> 
       <li class="page"><a href="item1.html">item1</a></li> 
       <li class="page"><a href="item2.html">item2</a></li> 
       <li class="page"><a href="item3.html">item3</a></li> 
       <li class="page hidden-xs"><a href="item1.html"><img id="nav-brand" src="images/nav-logo1.png" width="120" alt="logo description"></a></li> 
       <li class="page"><a href="item4.html">item4</a></li> 
       <li class="page"><a href="item5.html">item5</a></li> 
       <li class="page"><a href="item6.html">item6</a></li> 
      </ul> 
     </div> 
    </div> 
</header>

來源

2016-09-22 SealHead1

控制檯中的任何錯誤？你有沒有包含正確的文件？ – j08691

檢查，如果你有meta標籤在你的腦袋節

<meta name="viewport" content="width=device-width, initial-scale=1">

而且您的導航標記不ul元素後關閉。檢查標籤關閉

我覺得</div>的</ul>必須更換

來源

2016-09-22 20:19:01

在原代碼後，有封閉的資產淨值股利。當我爲這個網站格式化時發生了這種情況。在原文中，它由一個導航標籤關閉。我忘了包含標題集。在這裏，他們是：

<head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>Home</title> 
    <link rel='shortcut icon' href='images/favicon.ico' type='image/x-icon'/ > 
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" 
     crossorigin="anonymous"> 
    <link rel="stylesheet" href="css/styles.css"> 
    <script src="js/main.js"></script> 
    <script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" 
     crossorigin="anonymous"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" 
     integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
    <link href="https://fonts.googleapis.com/css?family=Oswald:300,400,700" rel="stylesheet"> 
    <script src="https://use.fontawesome.com/8633c13aa3.js"></script> 
</head>

來源

2016-09-22 20:37:01 SealHead1

你應該檢查水平滾動當u減少screen.that是原因之一，當在沒有充分響應您的內容和當u最小化水平滾動出現在屏幕和漢堡包圖標不會出現...

首先刪除所有內容，期望您的網頁上的導航，然後儘量減少屏幕。如果問題仍然存在，那麼你也應該檢查你的背景顏色和顏色是否改變。

來源

2016-09-22 20:46:03

我試過了。你能解釋一下你對背景顏色變化的意思嗎？ – SealHead1

漢堡包和下拉菜單不能在移動設備上顯示使用Bootstrap導航欄

回答

相關問題