2017-09-12 109 views
-2

我是新手,很快就陷入困境。首先我想提一下,我从getbootstrap获得了所有代码,并复制和粘贴,并将其调整为符合我的需要。因此首先我得到了链接和元数据(包括链接到最新引导程序4,alpha版本)。然后我使用getbootstrap中的代码snipet来实现导航栏。我改变了我需要的,并使用它所有的html文档。bootstrap navbar无法正常工作

现在,它可以在主页上工作,但在其他6个页面上很少使用。我知道这听起来很奇怪,但是,通常情况下,导航栏在其他页面上完全没有显示,但有时它会在联系页面上显示,例如,稍后它可能会从联系页面中再次消失,但会在常见问题页面上显示,没有任何人搞乱了代码。马贝这是一个很好的理念,以获得更老的,但更稳定的引导版本?

这里是index.html文件的代码:

<!DOCTYPE html> 
    <html lang="ro"> 
    <head> 
    <!-- Required meta tags --> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 

    <!-- Bootstrap CSS --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css 
integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"> 


    </head> 


    <body> 

     <h1>Hello, world!</h1> 


      <nav class="navbar navbar-expand-lg navbar-light bg-light"> 
     <a class="navbar-brand" href="#">Navbar</a> 
     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> 
     <span class="navbar-toggler-icon"></span> 
     </button> 

     <div class="collapse navbar-collapse" id="navbarSupportedContent"> 
     <ul class="navbar-nav mr-auto"> 
      <li class="nav-item active"> 
      <a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="servicii.html">Servicii</a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="dotari.html">Dotari</a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="preturi.html">Preturi</a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="testimoniale.html">Testimoniale</a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="faq.html">Intrebari frecvente</a> 
      </li> 
      <li class="nav-item"> 
      <a class="nav-link" href="locatie.html">Locatie</a> 
      </li> 

     </ul> 
     <form class="form-inline my-2 my-lg-0"> 
      <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search"> 
      <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> 
     </form> 
     </div> 
    </nav> 

     <!-- Optional JavaScript --> 
     <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
     <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
     <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script> 
     <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script> 
     </body> 
    </html> 

而现在,这里是代码到其他页面中的一个,我认为1就足够了,因为他们是同样的事情,所以我不会让你阅读7页的代码。目前我没有任何css或js文件,因为我正在使用bootstrap。

<!DOCTYPE html> 
<html lang="ro"> 
    <head> 
    <!-- Required meta tags --> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> 

    <!-- Bootstrap CSS --> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous"> 
    </head> 
    <body> 
    <h1>Hello, world!</h1> 



     <nav class="navbar navbar-expand-lg navbar-light bg-light"> 
    <a class="navbar-brand" href="#">Navbar</a> 
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> 
    <span class="navbar-toggler-icon"></span> 
    </button> 




     <div class="collapse navbar-collapse" id="navbarSupportedContent"> 
    <ul class="navbar-nav mr-auto"> 
     <li class="nav-item"> 
     <a class="nav-link" href="index.html">Home <span class="sr-only">(current)</span></a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="servicii.html">Servicii</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="dotari.html">Dotari</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="preturi.html">Preturi</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="testimoniale.html">Testimoniale</a> 
     </li> 
     <li class="nav-item active"> 
     <a class="nav-link" href="faq.html">Intrebari frecvente</a> 
     </li> 
     <li class="nav-item"> 
     <a class="nav-link" href="locatie.html">Locatie</a> 
     </li> 

    </ul> 
    <form class="form-inline my-2 my-lg-0"> 
     <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search"> 
     <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> 
    </form> 
    </div> 



    <!-- Optional JavaScript --> 
    <!-- jQuery first, then Popper.js, then Bootstrap JS --> 
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script> 
    </body> 
</html> 
+0

请在发布问题之前阅读本文:https://stackoverflow.com/help/how-to-ask – ZimSystem

+0

欢迎使用StackOverflow。请提供您的代码并写下您面临的问题。之后我们可以帮助你。 –

回答

0

好吧,所以我自己想清楚了。

首先,我说我使用了bootstrap 4的alpha版本。我错了,它是beta版本。

现在,答案!代码工作得很好,这是令人沮丧的根源,因为我一次又一次地查看一个我知道它是corect的代码,但不知怎的,它不起作用。 它实际上是一个ftp错误,出于某种原因,当我将文件上传到服务器时,其他页面上的导航栏没有上传,因此浏览器没有显示导航栏,因为服务器上没有导航显示。