Bootstrap Alpha 4導航欄在單擊時不起作用

Question

我使用Bootstrap 4編寫了以下導航欄代碼。1.我無法弄清楚為什么3欄圖標不會在右側顯示。2.為什么在鏈接上的onclick不能正確觸發。 我必須單擊該鏈接，然后單擊窗口上其他任何位置，以使該鏈接帶有下划線。 3.我無法將菜單項向右對齊

 $('.nav-link').on('click', function () { $('.active').removeClass('active'); $(this).addClass('active'); }); 

 <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <nav class="navbar navbar-toggleable-md"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navigation-menu" aria-controls="navigation-menu" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#">WELCOME</a> <div class="navbar-collapse collapse" id="navigation-menu"> <div class="navbar-nav mr-auto"> <a class="nav-item nav-link active" href="#section1">link1</a> <a class="nav-item nav-link" href="#section2">link2</a> </div> </div> </nav> 

Answer 1

您需要為切換圖標指定navbar-light或navbar-inverse ，並顯示活動鏈接。

<nav class="navbar navbar-light navbar-toggleable-md">

要么

<nav class="navbar navbar-inverse navbar-toggleable-md">

http://www.codeply.com/go/HZBegMbGii

另外， ml-auto將用於將navbar-nav到右側

Answer 2

“雕文”已從Bootstap 4中刪除。

刪除了Glyphicons圖標字體。 如果需要圖標，則可以使用以下選項：Glyphicons Octicons字體的上游版本

通過： https : //v4-alpha.getbootstrap.com/migration/#components

解決方法是手動包括Glyphicons css文件。