Bootstrap導航欄崩潰圖標沒有出現，也沒有工作

Question

我試圖在我的一個小項目上實現可摺疊的導航欄。我的問題是當我調整窗口的大小時，導航欄會崩潰，但按鈕（即使它是可點擊的）不會顯示，也不會提供給我任何選項。

我不知道這是一個jQuery/JS問題。我只是一個初學者，所以我只是在codepen設置上鍊接了一些庫。我看了一些關於這個問題的人的問題，但沒有任何解決方案對我有幫助。

該codepen鏈接是：https://codepen.io/diegomengue/pen/XgRamN。

任何有關這個問題的幫助（以及所有類型的提示），我們感謝！

謝謝。

HTML：

<nav class='navbar navbar-toggleable-sm mx-auto sticky-top'> 
    <button class="navbar-toggler collapsed mx-auto" type="button" data-toggle="collapse" data-target="#navbarNav" aria-expanded="false" aria-controls="navbarNav" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 

    <div class="collapse navbar-collapse" id="navbarNav"> 
    <ul class='navbar-nav mx-auto'> 
    <li class='nav-item'><a href='#sobreMim' class='nav-link'><strong>Diego Mengue</strong></a></li> 
    <li class='nav-item'><a href='#portfolio' class='nav-link'>Portfólio</a></li> 
    <li class='nav-item'><a href='#contato' class='nav-link'>Contato</a></li> 
    </ul> 
    </div> 
    </nav> 

Answer 1

導航欄toggler類期待Navbar的顏色方案類型的類。試試這個筆

<nav class='navbar navbar-inverse navbar-toggleable-sm mx-auto sticky-top'> 
    <button class="navbar-toggler collapsed mx-auto" type="button" data-toggle="collapse" data-target="#navbarNav" aria-expanded="false" aria-controls="navbarNav" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    <span class="icon-bar"></span> 
    </button> 
     <div class="collapse navbar-collapse" id="navbarNav"> 
    <ul class='navbar-nav mx-auto'> 
     <li class='nav-item'><a href='#sobreMim' class='nav-link'><strong>Diego Mengue</strong></a></li> 
     <li class='nav-item'><a href='#portfolio' class='nav-link'>Portfólio</a></li> 
     <li class='nav-item'><a href='#contato' class='nav-link'>Contato</a></li> 
    </ul> 
    </div> 
    </nav> 

https://codepen.io/dannybrown/pen/yXXBxK?editors=1100

如果你不想遵循現有的配色方案，在您的自定義樣式

添加了導航欄，toggler類樣式