2017-09-12 36 views
-2

私はブートストラップを初めて経験しました。 最初に、getbootstrapのコードをすべてコピー&ペーストして、自分の必要に合わせて調整したことを言いたいと思います。 まず、リンクとメタデータ(最新のブートストラップ4、アルファ版へのリンクを含む)を取得しました。その後、navbを実装しているgetbootstrapのコードスニペットを使用しました。私は必要なものを変更し、すべてのHTML文書を使用します。ブートストラップnavbarが正しく動作していません

今では、ホームページではすべて動作しますが、他の6ページではほとんど動作しません。私はこれが奇妙に聞こえるが、普段はnav-barは他のページでは何もしていないが、例えば連絡先ページで表示され、後で連絡先ページから消えてしまうかもしれないが、誰もコードを迷わずに。ブートストラップのバージョンは古いものの、より安定しています。ここ

は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ファイルがありません。

<!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

わかりましたので、自分で理解しました。

最初に、私はブートストラップ4のアルファバージョンを使用したと述べました。私は間違っていました。ベータ版です。

今、答え! コードはうまく動いていて、それは欲求不満の原因でした。なぜなら、私はそれがコアークであることを知っていたコードを何度も見ていたからです。 実際にはftpエラーだったため、何らかの理由でファイルをサーバーにアップロードしたときに、他のページのナビゲーションがアップロードされなかったため、サーバー上にはブラウザが表示されませんでした表示するにはナビ。

関連する問題