이 부트 스트랩 탐색이 작동하지 않는 이유는 무엇입니까? 내가 부트 스트랩에 의해 제안 정확한 코드를 사용하고

: - 여기이 부트 스트랩 탐색이 작동하지 않는 이유는 무엇입니까? 내가 부트 스트랩에 의해 제안 정확한 코드를 사용하고

<nav class="navbar navbar-default navbar-static-top"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <button type="button" data-target="#navbarCollapse5" data-toggle="collapse" class="navbar-toggle"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      <a href="#" class="navbar-brand">Brand</a> 
     </div> 
     <div id="navbarCollapse5" class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav"> 
       <li class="active"><a href="#">Home</a></li> 
       <li><a href="#">Profile</a></li> 
       <li><a href="#">Messages</a></li> 
      </ul> 
      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#">Login</a></li> 
      </ul> 
     </div> 
    </div> 
</nav>

는 JSFiddle입니다.

내 JSFiddle에 외부 리소스로 부트 스트랩 CSS와 JS를 사용했음을 유의하십시오.

출처

2017-11-02 lk_wp

무엇이 작동하지 않나요? –

@sumitchauhan JSFiddle을 실행하고 결과를 보면 네비게이션이 예상대로 표시되지 않습니다. –

부트 스트랩 문서를 읽었습니까? – madalinivascu

지금 나를 위해 노력하고 시도하여 당신의 v4 markup을 사용하여 에테르를 필요 3.3.7

.bs-example{ 
 
    \t margin: 20px; 
 
    }

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
<meta charset="utf-8"> 
 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
 
<title>Example of Bootstrap 3 Static Navbar</title> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 

 
</head> 
 
<body> 
 
<div class="bs-example"> 
 
    <nav class="navbar navbar-default"> 
 
     <!-- Brand and toggle get grouped for better mobile display --> 
 
     <div class="navbar-header"> 
 
      <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle"> 
 
       <span class="sr-only">Toggle navigation</span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
       <span class="icon-bar"></span> 
 
      </button> 
 
      <a href="#" class="navbar-brand">Brand</a> 
 
     </div> 
 
     <!-- Collection of nav links and other content for toggling --> 
 
     <div id="navbarCollapse" class="collapse navbar-collapse"> 
 
      <ul class="nav navbar-nav"> 
 
       <li class="active"><a href="#">Home</a></li> 
 
       <li><a href="#">Profile</a></li> 
 
       <li><a href="#">Messages</a></li> 
 
      </ul> 
 
      <ul class="nav navbar-nav navbar-right"> 
 
       <li><a href="#">Login</a></li> 
 
      </ul> 
 
     </div> 
 
    </nav> 
 
</div> 
 
</body> 
 
</html>

출처

2017-11-02 05:26:07

작동 대답을 편집 한 의견 – madalinivascu

감사를 사용 –

사용하려고 부트 스트랩 V4.0.0 - beta.2를 사용하여 부트 스트랩의 최신 버전을 사용 하시거나 사용 하시겠습니까? v3 for your current markup

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

출처

2017-11-02 05:31:01 madalinivascu

이 부트 스트랩 탐색이 작동하지 않는 이유는 무엇입니까? 내가 부트 스트랩에 의해 제안 정확한 코드를 사용하고

답변

관련 문제