트위터 부트 스트랩 톱 메뉴가 스트립으로 표시되지 않습니다.

Question

방금 ​​트위터 부트 스트랩을 사용하기 시작했습니다. 자신의 사이트에서 각 예제를 사용하고 있습니다. 그러나 나는 대부분의 경우 성공할 수 없었다. 예를 들어, 상단 네비게이션 바입니다. 방금 html 파일에 복사했습니다. css, js의 일부 참조 경로가 변경되었습니다. IE8/Chrome에서 탐색 할 때 별난 결과가 나타납니다. http://getbootstrap.com/examples/navbar-fixed-top/

<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=edge"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<meta name="description" content=""> 
<meta name="author" content=""> 
<link rel="shortcut icon" href="favicon.png"> 


<title>Fixed Top Navbar Example for Bootstrap</title> 

<!-- Bootstrap core CSS --> 
    <link href="bootstrap/css/bootstrap.css" rel="stylesheet" /> 

<!-- Custom styles for this template --> 
    <link href="Scripts/navbar-fixed-top.css" rel="stylesheet" /> 

<!-- Just for debugging purposes. Don't actually copy this line! --> 
<!--[if lt IE 9]><script src="../../docs-assets/js/ie8-responsive-file-warning.js"></script><![endif]--> 

<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries --> 
<!--[if lt IE 9]> 
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 
    <script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script> 
<![endif]--> 

<!-- Fixed navbar --> 
<div class="navbar navbar-default navbar-fixed-top" role="navigation"> 
    <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> 
     <a class="navbar-brand" href="#">Project name</a> 
    </div> 
    <div class="navbar-collapse collapse"> 
     <ul class="nav navbar-nav"> 
     <li class="active"><a href="#">Home</a></li> 
     <li><a href="#about">About</a></li> 
     <li><a href="#contact">Contact</a></li> 
     <li class="dropdown"> 
      <a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a> 
      <ul class="dropdown-menu"> 
      <li><a href="#">Action</a></li> 
      <li><a href="#">Another action</a></li> 
      <li><a href="#">Something else here</a></li> 
      <li class="divider"></li> 
      <li class="dropdown-header">Nav header</li> 
      <li><a href="#">Separated link</a></li> 
      <li><a href="#">One more separated link</a></li> 
      </ul> 
     </li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="../navbar/">Default</a></li> 
     <li><a href="../navbar-static-top/">Static top</a></li> 
     <li class="active"><a href="./">Fixed top</a></li> 
     </ul> 
    </div><!--/.nav-collapse --> 
    </div> 
</div> 
<div class="container"> 
    <!-- Main component for a primary marketing message or call to action --> 
    <div class="jumbotron"> 
    <h1>Navbar example</h1> 
    <p>This example is a quick exercise to illustrate how the default, static and fixed to top navbar work. It includes the responsive CSS and HTML, so it also adapts to your viewport and device.</p> 
    <p>To see the difference between static and fixed top navbars, just scroll.</p> 
    <p> 
     <a class="btn btn-lg btn-primary" href="../../components/#navbar" role="button">View navbar docs &raquo;</a> 
    </p> 
    </div> 
</div> <!-- /container --> 
<!-- Bootstrap core JavaScript 
================================================== --> 
<!-- Placed at the end of the document so the pages load faster --> 
<script src="https://code.jquery.com/jquery-1.10.2.min.js"></script> 
    <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet" /> 

===

참고 : 나는 (여기에) 삽입 할 수있는 머리 닫는 태그 본문 개방 태그가 오른쪽에서 복사

=== 소스 고정 된 탐색 표시 줄 앞에

내 브라우저의 결과 :

나는 무엇이 있습니까?

Answer 1

문제는 HTML 확인이 fiddle

복사이 예에서 JS 및 CSS에서 아니고, 작동 또는이 두 libs와를 포함

//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css 
//netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js